从子页面调用时对话框模式窗口未关闭答案

【问题标题】：dialog modal window not closing when called from child page从子页面调用时对话框模式窗口未关闭
【发布时间】：2015-09-29 19:00:25
【问题描述】：

我正在尝试将 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" />

子页面Js代码：

   $(function () {
        $('#btnCloseChildPageRefreshParent').on('click', function () {
            refreshParent();
            open(location, '_self').close();
        });

        function refreshParent() {
            window.opener.location.reload();
        }
    });

【问题讨论】：

你试过window.parent.location.reload(); 吗？
感谢指正...对开瓶器和父母感到困惑
@LilRazi 请注意框架和父级的域必须匹配，否则安全错误将阻止重新加载。

标签： javascript jquery jquery-ui

【解决方案1】：

这是一个iframe，因此您需要使用window.parent (see the MDN documentation here) 而不是window.opener。它不是一个新窗口，而是一个框架，所以没有开启器。

注意frame和parent的域必须匹配，否则调用会因为跨域安全限制而失败。

下面的代码示例将打印出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);
  }
}

&lt;button id="button"&gt;Reload Parent&lt;/button&gt;

【讨论】：