Javascript, чтобы открыть всплывающее окно и отключить родительское окно - PullRequest
Новая
       1

Javascript, чтобы открыть всплывающее окно и отключить родительское окно

21 голосов
/ 14 апреля 2011

Я хочу открыть всплывающее окно и отключить родительское окно.Ниже приведен код, который я использую: 

function popup()
{

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

По некоторым причинам родительское окно не отключается.Нужен ли какой-то дополнительный код ИЛИ в чем дело?

Опять же, я ищу что-то похожее на то, что мы получаем, когда мы используем showModalDialog () .. т.е. оно вообще не позволяет выбирать родительское окно..Только что я хочу сделать то же самое, используя window.open

Также, пожалуйста, предложите код, который будет кросс-браузерно-совместимым ..

Ответы [ 5 ]

30 голосов
/ 14 апреля 2011 
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>
2 голосов
/ 14 апреля 2011

Насколько мне известно, вы не можете отключить окно браузера.

Что вы можете сделать, это создать всплывающее окно jQuery (или аналогичное), и когда это всплывающее окно появляется в родительском браузеребудет отключен

Откройте вашу дочернюю страницу во всплывающем окне.

1 голос
/ 10 июня 2015

Вот так я наконец и сделал!Вы можете нанести слой (полноразмерный) на ваше тело с высоким z-индексом и, конечно, скрытый.Вы сделаете его видимым, когда окно открыто, сфокусируете его на щелчке по родительскому окну (слою) и, наконец, исчезните, когда открытое окно будет закрыто или отправлено, или как угодно. 

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

Надеюсь, это поможет: -)

1 голос
/ 14 апреля 2011

Ключевым термином является модальный диалог.

Как таковой, встроенный модальный диалог не предлагается.

Но вы можете использовать множество других доступных, например, this

0 голосов
/ 04 июля 2016

Привет, ответ, который опубликовал @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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...