从任何地方关闭 javascript-popup-window

2024-04-15

我正在尝试构建一个可以从任何地方关闭的弹出窗口。

在主页上，您可以选择打开它。在浏览主页时的任何时候，用户都可以再次关闭它。

我找到了这个基本的弹出控件：

 function popuponclick()
   {
      my_window = window.open("", "mywindow","status=1,width=350,height=150");
   }

   function closepopup()
   {
      my_window.close ();
   }

问题是，一旦您离开打开弹出窗口的页面，该功能就会失去连接，并且弹出窗口将不再关闭。

有没有办法解决并关闭这个特定的弹出页面？

我根据实际问题提出了三种解决方案。

1) closepopup()在其他页面不起作用

如果您需要在从页面 A 打开弹出窗口时从页面 B 关闭弹出窗口，则以下代码将允许您从页面 B 获取对弹出窗口的引用并将其关闭。参考：查找先前通过 window.open 打开的窗口 https://stackoverflow.com/questions/2455158/find-window-previously-opened-by-window-open

A页.html

<script>
 function popuponclick()
   {
      my_window = window.open("http://google.com", "mywindow","status=1,width=350,height=150");
   }

   function closepopup()
   {
      my_window.close ();
   }
</script>

<a href="javascript:popuponclick()">Open window...</a></br>
<a href="PageB.html">Go to Page B</a>

</body>
</html>

页面.html

<html>
<body>

<script>
   function closepopup()
   {
      var popupPlayer= window.open('', 'mywindow', 'status=1,width=350,height=150') ;
      popupPlayer.focus();
      popupPlayer.close();
   }
</script>

<a href="javascript:closepopup()">Close window...</a></br>

</body>
</html>

2) closepopup() 不能在打开窗口的同一页面上工作

需要对 my_window 进行全局引用，因此您需要像这样更改代码：

     var my_window; //global reference here
    function popuponclick()
       {
          my_window = window.open("", "mywindow","status=1,width=350,height=150");
       }

       function closepopup()
       {
          my_window.close ();
       }

3）最终使用框架的第三种解决方案

您将页面分成 1 个框架（一个为 100%），另一个为 0%。

您在父框架中添加窗口打开/关闭代码。比你通过跨框架 JavaScript 命令调用窗口控制代码。

包含 Javascript 的 HTML 框架

<html>
<head>
<title>My example</title>

<script>

  var my_window;

 function popuponclick()
   {
      my_window = window.open("", "mywindow","status=1,width=350,height=150");
   }

   function closepopup()
   {
      my_window.close ();
   }
</script>

</head>
<frameset cols="100%,0%">
<frame src="frame.html"/>
<frame/>
</frameset>
</html>

内部框架 (frame.html) - 调用父 Javascript

<html>
<body>
<a href="javascript:parent.popuponclick()"> Open Window </a><br/>
<a href="javascript:parent.closepopup()"> Close Window </a><br/>
<a href="javascript:location.href=location.href"> Refresh Frame (and try again)</a><br/>
</body>
</html>

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

jQuery