Javascript打开popup窗口并禁用父窗口

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

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

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

再次,我正在寻找类似于我们使用showModalDialog()时得到的东西。即它不允许select父窗口..唯一的事情是我想要使用window.open完成相同的事情

也请build议将跨浏览器兼容的代码..

 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> 

据我所知,你不能禁用浏览器窗口。

你可以做的是创build一个jQuery (或类似types的)popup窗口,当这个popup窗口出现你的父浏览器将被禁用。

在popup菜单中打开您的子页面。

这是我最终做到的! 你可以在你的身体上放置一个全尺寸的图层,当然这个图层是隐藏的。 当窗口打开时,您将使其可见,使其侧重于单击父窗口(图层),最后在打开的窗口closures或提交时消失。

  .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> 

打开popup窗口的function:

  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"; } 

我希望这会有所帮助:-)

关键术语是modal dialog。

因此,没有内置的模式对话框提供。

但是你可以使用许多其他的可用的例如这个

您好@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>