Открыть div в новом окне - по нажатию кнопки

Question

Ребята, я пытаюсь открыть div в новом окне, и я пытался с window.open, он работает как положено.

HTML:

<div id="pass">pass this to the new window</div>
<a href="#" onclick="openWin()">click</a>

JS:

  function openWin() {
    var divText = document.getElementById("pass").outerHTML;
    var myWindow = window.open('', '', 'width=200,height=100');
    var doc = myWindow.document;
    doc.open();
    doc.write(divText);
    doc.close();
  }

http://jsfiddle.net/KZYJU/

Проблема : Если окно уже открыто, при повторном нажатии кнопки оно не должно снова открывать новое окно. Пользователь должен видеть только одно окно. В моем случае, если я нажму кнопку 10 раз, откроется 10 окон.

Ребята, пожалуйста, помогите мне в этом.

Answer 1

Вы можете сделать это следующим образом:

  var popup;

  function openWin() {
    if (popup && !popup.closed) {
      popup.focus();
      /* or do something else, e.g. close the popup or alert a warning */
    } else {
      var divText = document.getElementById("pass").outerHTML;
      popup = window.open('', '', 'width=200,height=100');
      var doc = popup.document;
      doc.open();
      doc.write(divText);
      doc.close();
    }
  }

Это будет проверять, открыто ли всплывающее окно, и если это так, то оно будет фокусироваться.

Демо

Answer 2

Установите имя окна в вашем вызове на window.open

window.open('', 'popupWindowName', 'width=200,height=100');

windowName - это строка DOMString, определяющая имя контекста просмотра (окна или вкладки), в который загружается указанный ресурс; если имя не указывает на существующий контекст, создается новое окно и ему дается имя, указанное в windowName. Это имя можно затем использовать в качестве целевого объекта для ссылок и форм, указав его в качестве целевого атрибута или элемента. Имя не должно содержать пробелов. Имейте в виду, что это не будет использоваться в качестве отображаемого заголовка окна. Если строка пуста, браузер будет каждый раз создавать новое окно (это поведение не работает при замене строки на NULL).

1010 * * Источник

Answer 3

Поскольку вы можете написать какой-нибудь скрипт в новом окне, вы можете использовать куки для хранения в них данных в виде флажков, чтобы вы знали, что окно открыто в данный момент.

На главной странице вы сначала устанавливаете флаг (я назову его windowOpen) на false и проверяете каждый раз, когда нажимаете на ссылку. Если это ложь, тогда откройте новое окно; в противном случае ничего не делать.

В следующем окне установите флаг в значение true при открытии и установите в значение false при закрытии.

Answer 4

Просто играйте с флагом Boolean. Сделайте это правдой, когда вы щелкнете по нему в первый раз. и ограничить это этим.

var flag = false;
function openWin() {
  if(!flag) {
      var divText = document.getElementById("pass").outerHTML;
      var myWindow = window.open('', '', 'width=200,height=100');
      var doc = myWindow.document;
      doc.open();
      doc.write(divText);
      doc.close();
      flag = true
    }
}

<div id="pass">pass this to the new window</div>
<a href="#" onclick="openWin()">click</a>