javascript showModalDialog modal dialog box usage instructions_javascript skills

1. Standard method

Copy code The code is as follows:

Example: Click

2. It should be noted that Firefox This function is not supported. The syntax it supports is

Copy code The code is as follows:

window .open
('openwin.html','newWin', 'modal=yes, width=200,height=200,resizable=no, scrollbars=no' );

3. How to automatically determine the browser

Copy code The code is as follows:

4. In IE, the modal dialog box will hide the address bar, while in other browsers The device is not necessarily

[Note] In Google Chrome, the effect of this modal will also be invalid.

5. Generally when a dialog box pops up, we all want the background of the entire parent page to change to a semi-transparent color, so that users can see that the back is inaccessible

And after closing the dialog box, I want to restore it

How is this done?

Copy code The code is as follows:

///Display the details of an order, through A modal dialog box, and the screen will change color
function ShowOrderDetails(orderId) {
var url = "details.aspx?orderID=" orderId;
//$("body").css( "filter", "Alpha(Opacity=20)");
//filter:Alpha(Opacity=50)
$("body").addClass("body1");
ShowDetailsDialog(url , "600px", "400px", "yes");
$("body").removeClass("body1");
}

Also, there is a stylesheet Definition

Copy code The code is as follows:

.body1
{
background- color:#999999;
filter:Alpha(Opacity=40);
}

6. How to transfer values ​​between pages
showModalDialog value transfer and refresh
(1) Example of using showModalDialog. The parent window passes the value to the child window, the child window sets the value of the parent window, and when the child window is closed, the value is returned to the parent window.
farther.html

Copy code The code is as follows:

传递到父窗口的值:

返回的值:

子窗口设置的值:

child.html

复制代码 代码如下:

父窗口传递来的值:

输入要设置父窗口的值:

输入返回的值:

说明:
由于showModalDialog缓存严重,下面是在子窗口取消客户端缓存的设置.也可以在服务器端取消缓存,参考:
http://adandelion.cnblogs.com/articles/252137.html



二)下面是关闭刷新父窗口的例子
farther.html

复制代码 代码如下:

传递到父窗口的值:

child.html

复制代码 代码如下:

父窗口传递来的值:

说明
1.下面是取消客户端缓存的:



也可以在服务器端取消缓存,参考:
http://adandelion.cnblogs.com/articles/252137.html
2.向父窗口传递阐述在ASP.NET中也可以是用aaa.aspx?id=1的方式传递.
3.不刷新父窗口的话在父窗口中直接这样一来设置可以.
<script> <br>window.showModalDialog("child.html",window,"dialogWidth:335px;status:no;dialogHeight:300px"); <br></script>
4.在子窗口中若要提交页面的话要加入:,这样就不会打开新窗口了.