一、在页面调用window.open()函数后，可以直接在打开的页面中用window.opener来调用父页面的方法，然而如果用 showModalDialog打开一个模态窗口，就不能通过window.opener去调用父窗口的方法了，这时，要用 window.dialogArguments去调用，注意在showModalDialog方法中的第二个参数是window,即把当前窗口传给子页面，所以子页面才可以通过window.dialogArguments去调用父页面的方法。
父页面js如下：
//显示设置页面
function showSet(url) {
//showWin(800, 600, "FieldShowSet.aspx" + url, "set");
open_Dialog("FieldShowSet.aspx" + url, window, 800, 640);
}
//触发查询事件
function searchData() {
var btn = document.getElementById("<%=btnQuery.ClientID %>");
btn.click();
}
子页面js如下：
function CloseWin() {
//alert('设置成功！'); window.opener.searchData(); window.close();
var pWindow = window.dialogArguments;
if (pWindow != null) {
pWindow.searchData();
} else {
window.opener.searchData();
}
window.close();
}
二、当我们在模态窗体中刷新时，会打开一个新页面，这是我们可以通过在<head>中加上如下代码解决这一问题：
<base target="_self"/>
另外，当在模态窗体中刷新时，由于是提交到当前页，数据并不会更改，因为它是从页面缓存中读取数据，要让其变更，我们可以通过在<head>中添加如下代码清除缓存即可：
<meta http-equiv="pragma" content="no-cache"/>
<meta http-equiv="cache-control" content="no-cache,must-ridate"/>
<meta http-equiv="expires" content="0"/>
三、模态窗体居中显示
//路径地址，window对象，宽，高
function open_Dialog(url, win,Width, Height) {
var return_Value;
var iTop2 = (window.screen.availHeight - 20 - Height) / 2;
var iLeft2 = (window.screen.availWidth - 10 - Width) / 2;
var height2 = Height - 40;
if (document.all && window.print) {
return_Value = window.showModalDialog(url, win, "dialogLeft:" + iLeft2 + "px;dialogTop:" + iTop2 + "px;dialogWidth:" + Width +
"px;dialogHeight:" + Height + "px;center:yes;status:no;scroll:no;help:no;");
}
else {
window.open(url, win, "top=" + iTop2 + ",left=" + iLeft2 + ",width=" + Width + "px,height=" + height2 + "px,resizable=1,scrollbars=0");
}
}
四、替代解决方案
个人更偏向于使用第三方的js库(jquery)来实现悬浮可拖动的遮罩层来实现此效果，既快速又美观，而且兼容性非常好。如lhgdialog.min.js 下载地址：Scripts
首先在需要使用居中模态效果的界面添加jquery.js引用和lhgdialog.min.js引用如下：
<script src="scripts/jquery.js" type="text/javascript"></script>
<script src="scripts/lhgdialog.min.js?self=true&skin=iblue" type="text/javascript"></script>
调用方式如下：
效果图：
关于此弹出窗口组件更加详细的配置信息请查看：http://www.weiboxiu.cn/plugin/lhgdialog4/api.html
当前位置：
论坛首页 »
自由讨论区 »
Android, Python及开发编程讨论区
»
发起投票
技术讨论
加好友
发消息
2015-1-29 14:54:24 |
赞(
操作
