test.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK"> <title>对话框测试</title> <script type="text/javascript"> var windowArray = new Array(); function destorySonWindow() { if(!document.all) { for(var i = 0; i < windowArray.length; i++) { if(windowArray[i]) { windowArray[i].close(); } } } } function showDialog(url, _left, _top, _width, _height, _modal, _resizable, _status, _scroll) { var result; var iTop = (window.screen.availHeight- 30 - _height) / 2; var iLeft = (window.screen.availWidth- 10 - _width) / 2; if(_left == -1 || _top == -1) { _left = iLeft; _top = iTop; } var ieFeatures = "dialogWidth=" + _width + "px;" + "dialogHeight=" + _height + "px;" + "dialogLeft=" + _left + "px;" + "dialogTop=" + _top + "px;" + "resizable=" + _resizable + ";" + "status=" + _status + ";" + "scroll=" + _scroll; var otherFeatures = "width=" + _width + "," + "height=" + _height + "," + "left=" + _left + "," + "top=" + _top + "," + "resizable=" + _resizable + "," + "status=" + _status + "," + "scrollable=" + _scroll; if(_modal == 'yes') { window.openSonModel = true; } else { window.openSonModel = false; } if(document.all) { //ie if(_modal == 'yes') { result = window.showModalDialog(url, window, ieFeatures); } else { result = window.showModelessDialog(url, window, ieFeatures); } } else { //other otherFeatures += ',modal=' + _modal; result = window.open(url, '_blank', otherFeatures); windowArray.push(result); } return result; } function test() { showDialog('x.html', -1, -1, 200, 200, 'yes', 'yes', 'yes', 'yes'); } </script> </head> <body onunload="destorySonWindow()"> <input type="text"> <input type="button" value="弹出对话框" onclick="test()" > </body> </html>
x.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <title>x</title> <script type="text/javascript"> function reloadParent(url) { if(!url || url == '') { if(document.all) { if(!window.dialogArguments.openSonModel) { window.dialogArguments.location.reload(); } } else { window.opener.location.reload(); } } else { if(document.all) { if(!window.dialogArguments.openSonModel) { window.dialogArguments.location = url; } } else { window.opener.location = url; } } } </script> </head> <body> hello, world <br> <input type="button" value="重载父页面" onclick="reloadParent()" > </body> </html>
在test.html页面调用showDialog函数可以打开模式和非模式对话框(在firefox上不管modal参数设置成yes或on好像都是非模式对话框,另外,在firefox上主页面,它不会关闭由这个页面打开的对话框,所以,此函数也能在主页面关闭时,关闭由这个页面打开的对话框)。在x.html页面,可以刷新主页面,可以提供刷新url,也可以不提供,另外在ie下的模式对话框是不支持刷新刷新主页面。