Question

我想打开一个弹出窗口并禁用父窗口。以下是我正在使用的代码;

function popup()
{

    popupWindow = window.open('child_page.html','name','width=200,height=200');
    popupWindow.focus();
}

由于某种原因，父窗口不会被禁用。我需要一些额外的代码或者是什么情况？

同样，我正在寻找类似于当我们使用showModalDialog（）时得到的东西。它根本不允许选择父窗口。只是我想用window.open完成同样的事情。

另外请建议与浏览器兼容的代码..

Answer 1

var popupWindow=null;

function popup()
{
    popupWindow = window.open('child_page.html','name','width=200,height=200');
}

function parent_disable() {
if(popupWindow && !popupWindow.closed)
popupWindow.focus();
}

然后在父窗口的body标签中声明这些函数

<body onFocus="parent_disable();" onclick="parent_disable();">

正如您在此处所要求的那样是父窗口的完整html代码

<html>
<head>
<script type="text/javascript">

var popupWindow=null;

function child_open()
{ 

popupWindow =window.open('new.jsp',"_blank","directories=no, status=no, menubar=no, scrollbars=yes, resizable=no,width=600, height=280,top=200,left=200");

}
function parent_disable() {
if(popupWindow && !popupWindow.closed)
popupWindow.focus();
}
</script>
</head>
<body onFocus="parent_disable();" onclick="parent_disable();">
    <a href="javascript:child_open()">Click me</a>
</body>    
</html>

下面的new.jsp内容

<html>
<body>
I am child
</body>
</html>

Answer 2

据我所知，您无法禁用浏览器窗口。

您可以执行的操作是创建jQuery（或类似类型）弹出窗口，当此弹出窗口显示时，您的父浏览器将被禁用。

在弹出窗口中打开您的子页面。

Answer 3

关键术语是模态对话。

因此，没有内置的模态对话框。

但是你可以使用许多其他可用的，例如this

Answer 4

这就是我最终做到的！你可以在你的身体上放置一个具有高z-index的层（全尺寸），当然也是隐藏的。当窗口打开时，您将使其可见，使其专注于在父窗口（图层）上单击，最后在打开的窗口关闭或提交时或其他任何内容时将其消失。

      .layer
  {
        position: fixed;
        opacity: 0.7;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        z-index: 999999;
        background-color: #BEBEBE;
        display: none;
        cursor: not-allowed;
  }

和身体层：

                <div class="layout" id="layout"></div>

打开弹出窗口的功能：

    var new_window;
    function winOpen(){
        $(".layer").show();
        new_window=window.open(srcurl,'','height=750,width=700,left=300,top=200');
    }

保持新窗口的重点：

         $(document).ready(function(){
             $(".layout").click(function(e) {
                new_window.focus();
            }
        });

并在打开的窗口中：

    function submit(){
        var doc = window.opener.document,
        doc.getElementById("layer").style.display="none";
         window.close();
    }   

   window.onbeforeunload = function(){
        var doc = window.opener.document;
        doc.getElementById("layout").style.display="none";
   }

我希望它会有所帮助： - ）

Answer 5

你好@anu发布的答案是正确的，但它不会完全按要求工作。通过对 child_open（）函数进行轻微更改，它可以正常工作。

<html>
<head>
<script type="text/javascript">

var popupWindow=null;

function child_open()
{ 
if(popupWindow && !popupWindow.closed)
   popupWindow.focus();
else
   popupWindow =window.open('new.jsp',"_blank","directories=no, status=no, menubar=no, scrollbars=yes, resizable=no,width=600, height=280,top=200,left=200");

}
function parent_disable() {
  if(popupWindow && !popupWindow.closed)
    popupWindow.focus();
}
</script>
</head>
  <body onFocus="parent_disable();" onclick="parent_disable();">
     <a href="javascript:child_open()">Click me</a>
  </body>    
</html>

Javascript打开弹出窗口并禁用父窗口

5 个答案: