我正在尝试使用jQuery UI对话框作为弹出窗口,我想将另一个aspx页面作为主体添加到Jquery UI对话框中。在这里我不想使用Jquery按钮选项。在子页面,我已经放置了应关闭模态窗口的按钮并刷新父页面。下面是我一直试图实现的代码,但有些原因我收到了js错误消息。我在这里错过了什么吗?
父页面:aspx页面
<div>
<div id="dialog" title="This is Pop up ">
<div class="modal">
<div class="modal-body">
<iframe style="width: 100%; height: 100%;" src="childPage.aspx" runat="server" frameborder="0"></iframe>
</div>
</div>
</div>
<input type="button" value="open" id="OpenDialog"/>
</div>
Jquery代码:父页面
$(function () {
var dialog
dialog = $("#dialog").dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
});
$("#OpenDialog").button().on("click", function () {
dialog.dialog("open");
});
});
子页面:
<input type="button" id="btnCloseChildPageRefreshParent" value="Close and Refresh Parent Page" />
Child Page Js代码:
$(function () {
$('#btnCloseChildPageRefreshParent').on('click', function () {
refreshParent();
open(location, '_self').close();
});
function refreshParent() {
window.opener.location.reload();
}
});
答案 0 :(得分:1)
这是iframe
,因此您需要使用window.parent
(see the MDN documentation here)代替window.opener
。它不是一个新窗口,而是一个框架,因此没有开启者。
请注意,框架和父级域必须匹配,否则由于跨域安全限制,调用将失败。
下面的代码示例将打印出window.opener
的值以及调用window.parent.location.reload
时产生的错误来说明这一点。
function log (o) {
var el = document.createElement('div');
el.innerHTML = o;
document.body.appendChild(el);
}
document.getElementById('button').onclick = function () {
//This line could be used if the domain of the frame and parent match
//window.parent.location.reload();
log('window.opener is: ' + window.opener);
try {
window.parent.location.reload();
}
catch (e) {
log('Attempted to call window.parent.location.reload(): ' + e);
}
}
&#13;
<button id="button">Reload Parent</button>
&#13;