Question

基本上我有一个提供帮助系统的网站。激活后，此帮助系统会触发一个弹出窗口，其中会显示帮助内容。

当用户然后浏览网站时，通过使用我检测到的cookie（我在第一次打开窗口时设置并在用户关闭窗口时清除）是否仍然打开窗口并加载新的帮助内容对于新页面。

事实证明，将新内容加载到此弹出窗口的唯一方法是使用所需内容弹出一个具有相同名称的新页面（以便我们不会在任何地方打开多个弹出窗口）。

这在用户第一次触发弹出窗口时工作正常，但在此之后，当我尝试自动尝试弹出一个窗口时，我遇到了大多数浏览器的问题。

只是想知道是否有人对如何使其正常工作有任何想法？'

更新 @Rob

这是我的：

Page1.html

<html>
<head>
<script type="text/javascript" src="MainPopup.js"></script>
</head>
<body>
<h1>Page 1</h1>
<a href="Page2.html">Next</a>
<a href="javascript:setPopupActiveCookie();popup('Help1.html')">Click</a>
<script type="text/javascript">popupWindowIfCookieSet('Help1.html');</script>
</body>

Page2.html

<html>
<head>
<script type="text/javascript" src="MainPopup.js"></script>
</head>
<body>
<h1>Page 2</h1>
<a href="Page1.html">Prev</a>
<a href="javascript:setPopupActiveCookie();popup('Help2.html')">Click</a>
<script type="text/javascript">popupWindowIfCookieSet('Help2.html');</script>
</body>
</html>
</html>

Help1.html

<html>
<head>
<script type="text/javascript" src="Helper.js"></script>
</head>
<body>
<h1>Help 1</h1> 
</body>
</html>

Help2.html

<html>
<head>
<script type="text/javascript" src="Helper.js"></script>
</head>
<body>
<h1>Help 2</h1> 
</body>
</html>

MainPopup.js

var windowLocation;
 function setHelperWindow(new_windowLocation){
     windowLocation = new_windowLocation;
 }
 function popup(url){
     try{
         windowLocation.href = url;
     } catch(e){
         windowLocation = window.open(url, "HelperWindow").location;
     }
 }
 function popupWindowIfCookieSet() {
     //Stuffhere 
 }
 function setPopupActiveCookie() {
     //Stuffhere 
 }

Helper.js

(function(){
     var failures = 10*60; //Cancel poller after 1 minute without `opener`
     var poller = setInterval(function(){
        try{
            // Attempt to send the current location object to window.opener
            window.opener.setHelperWindow(location);
        }catch(e){
            if(!window.opener && failures-- < 0) clearInterval(poller);
        }
     }, 100);
 })();

不幸的是，这不起作用。应该发生的是，如果我从Page1打开Helper页面，当我转到Page2.html时，显示Help1.html内容的弹出窗口将切换到Help2.html。

目前它没有这样做。任何想法。

Answer 1

如果您的整个网站都在同一个域中托管，则可以使用window.opener媒体资源，并在您的网页上进行一些调整。

Main：声明变量windowLocation，功能setHelperWindow和popup
Main-popup：打开一个新窗口，并在变量windowLocation
帮助窗口：创建一个轮询器，尝试调用setHelperWindow对象的window.opener。如果window.opener窗口已关闭，则轮询器将终止。

因为windowLocation变量一直在更新（使用window.open()或弹出窗口中的轮询器功能），所以被弹出窗口阻止程序阻止的可能性会严重降低。 / p>

注意：每个主要和帮助页面都必须包含两个脚本：
<script src="filename.js"></script>

Helper.js

 (function(){
     var failures = 10*60; //Cancel poller after 1 minute without `opener`
     var poller = setInterval(function(){
        try{
            // Attempt to send the current location object to window.opener
            window.opener.setHelperWindow(location);
        }catch(e){
            if(!window.opener && failures-- < 0) clearInterval(poller);
        }
     }, 100);
 })();

MainPopup.js

 var windowLocation;
 function setHelperWindow(new_windowLocation){
     windowLocation = new_windowLocation;
 }
 function popup(url){
     try{
         windowLocation.href = url;
     } catch(e){
         windowLocation = window.open(url, "HelperWindow").location;
     }
 }

示例：用法（主要）

<a href="javascript:popup('/help-pages/howto-doing-popups-correctly')">Click</a>

Answer 2

为您所做的窗口指定名称应该可行，例如

window.open('help1.html', 'help');

然后，例如当page2加载时，

$(function () {
    window.open('help2.html', 'help');
});

请记住，除非添加例外，否则弹出窗口阻止程序会阻止此行为。例如。在chrome中，选项＆gt;＆gt;在引擎盖下＆gt;＆gt;内容设置＆gt;＆gt;弹出窗口＆gt;＆gt;管理例外。

免责声明：我不喜欢使用弹出窗口，而是使用灯光框代替您的在线帮助，通过 ajax 请求加载内容。

正确地做弹出窗口

2 个答案:

Helper.js

MainPopup.js

示例：用法（主要）