parent.location.assign（url）无法使用fancybox iframe
我正在尝试重新加载浏览器，用户在fancybox中点击了一个url链接，因此父窗口将在fancybox关闭后转到url，但仅在链接被点击时才会正常关闭fancybox。 我在fancybox中打开一个asp文件，它使用google maps api来显示交互式地图。 我正在测试点击标记时，infowindow会打开一个链接，这是一个新位置。 我已经关闭了fancybox并且父窗口重新加载，但由于某种原因我无法将父位置更改为新的URL！ 我觉得应该工作，因为其他一切都有效，这让我感到非常困惑。
我的asp文件中使用google maps api的代码如下所示：
var contentstring = document.createElement("div"); contentstring.innerHTML = ''+ ''+''+ ''+ ''; contentstring.className = "map-popup"; contentstring.style.height = "60px"; var infowindow = new google.maps.InfoWindow({content: contentstring}); google.maps.event.addListener(marker9, 'click', function() { infowindow.open(map,marker9); }); 我注意到的另一个奇怪的事情是，虽然我在fancybox $ .ready函数中创建了afterClose构造，但是当我强制fancybox与父级关闭时，它不会被调用。$。fancybox.close（）但是如果我关闭它会被调用通常是fancybox。 我应该补充一点，上面的代码是在我的asp文件的head部分而不是body中调用的。 我整夜都在黑客攻击这件事，但我仍然没有看到什么是错的。 我非常感谢任何有助于实现这一目标的帮助。
总而言之，fancybox中关闭并重新加载新URL的调用是：
parent.$.fancybox.close(); parent.location.assign(new-url); parent.location.reload(true);
但由于某种原因，fancybox关闭并使用现有/旧URL重新加载父级。
编辑 – 我刚刚注意到在谷歌浏览器中，调用了回调函数afterClose（），但是在IE11中它没有被调用。 对于这两种浏览器，fancybox关闭并重新加载，但它们都不会分配新的URL。 这是我想使用fancybox而不是新窗口弹出窗口的主要原因。
我也忘了提，我正在测试google maps api的url是http://www.lookathawaii.com/proddetail.asp?prod=96815-THE-FAT-GREEK点击“地图”标签然后点击在地图图像上（然后将地图向西北方向拖动，这样你就可以看到东南方的钻石头，然后点击钻石头中间的标记，看看infowindow弹出窗口的链接应该将用户带到我的钻石头页）。 还有一件事，fancybox从我正在测试的url中调用：
我通过对原始代码进行了非常小的更改解决了这个问题。 我用原来的3个电话来：
parent.$.fancybox.close(); parent.location.assign(new-url); parent.location.reload(true);
基于我读到的很多人在这里说的。 然而，我学到的是，调用’reload（true）’并不是必需的，并且实际上由于某种原因弄乱了。 当我测试这个订单时：
parent.location.assign(new-url); parent.$.fancybox.close();
它工作得很好，并使用新url重新加载父窗口！ 所以我在我的内容字符串中做了那么简单的改变，它再次完美地工作了！ 现在我已经创建了一个包含少量测试位置的地图，用户可以从地图上访问我网站上的任何位置（在IE11和Chrome中测试）。
我不确定为什么前面提到的3个调用不起作用，也许这是一个浏览器问题，但是必要的两个调用是按照确切的顺序“assign（new-url）”和“close（）”。 关闭fancybox后，浏览器将自动刷新，而不会调用’reload（）’。
您可能需要在父页面中创建一个临时元素，并从子页面（iframed）页面中定位该元素的ID，以便尝试
在您的父页面中：
var tempRedirect; // we'll use this var to store the URL coming from the iframe jQuery(document).ready(function ($) { $(".fancybox").fancybox({ type : "iframe", beforeShow : function () { // we create a temp element inside fancybox so it will be removed along $(".fancybox-wrap").append($("", { id : "tempRedirect", // <== the selector we'll target from iframe style : "display:none; position:aboslute;lef:-999px;" // not visible })); }, beforeClose : function () { // capture the content of our temp element (may be empty if closed normally) tempRedirect = $("#tempRedirect").html(); }, afterClose : function () { // validate if the variable is empty, otherwise redirect if (tempRedirect != "") { window.location.href = tempRedirect; }; } }); }); // ready
现在，在您的子页面上：
jQuery(document).ready(function ($) { // bind a click event to your selector (marker) $(".child_link").on("click", function (e) { e.preventDefault(); $("#tempRedirect", top.document).append(this.href); // target the element on parent page parent.jQuery.fancybox.close(); // close fancybox on parent }); // on }); // ready
由于您要为标记创建变量contentstring ，您可能更喜欢将脚本放在函数内并在onclick调用它，并将href作为参数传递，但您可以从上面的代码中获得全局图。
请参阅picssel.com上的DEMO
注意 ：
- DEMO使用fancybox v2.x.
- 据我所知，它适用于IE7 +，Firefox，Chrome，Opera和Safari。
- 应该在父页面和子页面上加载jQuery。
- 使用iframe符合相同的原始政策