【问题标题】:show one popup window at a time一次显示一个弹出窗口
【发布时间】:2015-10-14 13:27:18
【问题描述】:

如何一次只显示一个弹出窗口?

我创建了一个名为 parent.html 的页面。在父页面上,我有两个链接,一个是 register,另一个是 login。 如果我点击注册然后注册页面打开为子窗口 但 如果我点击登录然后已经打开的子框(注册)应该关闭并且登录子窗口应该打开或者所有以前打开的子框应该消失。

我的代码如下

<input type="button" value="login" onclick="ShowPopup('login.asp')" />
<script type="text/javascript">
 var popup;
    function ShowPopup(url) {
        popup = window.open(url, "self", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
        popup.focus();
    }
</script>
</form>

<input type="button" value="register" onclick="ShowPopup('register.asp')" />
<script type="text/javascript">
    var popup;
    function ShowPopup(url) {
        popup = window.open(url, "self", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
        popup.focus();
    }
</script>
</form>

我用“self”替换了“popup”。现在一次只打开一个子窗口,而不是多个子窗口并且工作完美。

但是当我关闭子窗口时,父页面没有刷新。

子窗口代码如下

<form id="form1" runat="server">
<input type="button" value="Refresh Parent" onclick="RefreshParent()" />
<script type="text/javascript">
    function RefreshParent() {
        if (window.opener != null && !window.opener.closed) {
            window.opener.location.reload();
        }
    }
    window.onbeforeunload = RefreshParent;
</script>
</form>

请帮帮我

【问题讨论】:

  • "popup" 你可以用"self"替换它。
  • @Jai 问题解决了 thanx.

标签: javascript jquery html


【解决方案1】:

第一件事,没有必要再次定义变量和函数......现在解决方案为 -

<script type="text/javascript">
 var popup;
    function ShowPopup(url) {
        if(popup)
        {
         popup.close();
        }
        popup = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,
                menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
        popup.focus();
    }
</script>

在您的子页面中,头部部分(关闭时刷新父窗口)

<script>
    window.onunload = refreshParent;
    function refreshParent() {
        if(window.opener)
          window.opener.location.reload(true);
    }
</script>

默认情况下,reload() 方法从缓存中重新加载页面,但您可以通过将参数传递给 true 来强制它从服务器重新加载页面。

-- 或--

您还可以在打开子窗口时在父窗口中编写一些代码,如果关闭时会自行刷新,则查找其子窗口..

<script type="text/javascript">
     var popup;
     var lookupTimer=null;
        function ShowPopup(url) {
            if(popup)
            {
             popup.close();
            }
            popup = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,
            statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
            popup.focus();
            lookupTimer = setInterval(function(){ loolUpChild(); }, 1000);
        }
    function loolUpChild()
    {
        if((popup.closed))
                {
                 window.location.reload(true);
                 clearInterval(lookupTimer);
                }   

    }
    </script>

【讨论】:

  • 子窗口关闭时如何刷新父窗口。我在上面写的子窗口的代码。
  • @lok​​eshpurohit ,恭喜你..你应该接受一个可以帮助其他人找到答案的答案
  • 另外两个问题....我们可以像模态弹出窗口一样从子窗口中删除标题栏吗?并且当子窗口打开时,父窗口应该用移植颜色遮盖?
  • 第二个可以通过css应用于父级来实现,而第一个“你不能操作窗口,因为它是浏览器的资产”
【解决方案2】:

如果之前的弹出窗口打开,则创建一个全局变量并维护您的标志,然后先关闭并打开新的 喜欢

 if(popup){
        popup.close();
        popup=false;
    }

然后打开新的

window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
    popup = true;

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-08-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-10-15
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多