模态类型的传值问题

亦凉 2022-08-02 07:14 118阅读 0赞

什么是模态？

![Center][]

一旦弹出模态窗口或对话框,如果用户不对其进行操作(如点击确定或取消按钮等),就如法进行其他的操作.

弹出模态窗口的语句:

var testSend = window.showModalDialog('modal.htm','','dialogHeight:150px;dialogWidth:500px;center:no');

**window.showModelessDialog(sURL\[,vArguments\]\[,sFeatures\])**

1)sURL 指明模态窗口的URL地址

2)vArguments 传递参数

3)sFeatures 窗口的外观大小等

其中第一个参数必须有,第二三个参数可有可无。

如何传值？

单击FrontPage.htm（A页面）中的按钮，弹出模态窗口modal.htm（B页面），点击modal.htm中的按钮关闭窗口，并返回值。

A页面js

function test() {
            alert("ID：" + window.dialogArguments.id+" ;"+"名字："+ window.dialogArguments.name);
            var message = {
                "state": "begin",
                "info": "404"
            };
            window.returnValue = message;
    
        }

B页面js

function test() {
            var person = {
             "id":"001",
            "name":"yangyang"
        };
        var testSend = window.showModalDialog('modal.htm',person,'dialogHeight:150px;dialogWidth:500px;center:no');
        alert("状态：" + testSend.state + " ;" + "信息：" + testSend.info);
    
         }

![Center 1][]

点击B页面确定按钮，将A页面的值传过来。

![Center 2][]

关闭B页面，将B页面的值传到A页面。

![Center 3][]

参数说明：

window.dialogArguments来取得传递进来的参数。

window.returnValue向打开对话框的窗口返回信息。

[Center]: /images/20220731/baad24f652a941d0b12679b08603915c.png
[Center 1]: /images/20220731/6ecf3a08b1f640cbbc3615720f7a1874.png
[Center 2]: /images/20220731/af0d41660a7b45229943d5972419231c.png
[Center 3]: /images/20220731/d940096088e44e69a86df8060c85133a.png