友達が困ってるので書いた。

ポップアップでウィンドウを開く時、二重でオープンしたり、開いてるウィンドウを間違えてリフレッシュしたりしないためにはどうするかということだと思う。

要するに普通にwindow.openで開けばいいのだが、このメソッドの返り値は開いた先のwindowなので、変数に閉じ込めればよい。そうすれば「closed」というプロパティで開いてるか閉じてるかが検出可能。

1
2
3
4
5
6

var myWin = window.open('http://blog.udzura.jp', 'mywindow1');
alert(myWin.closed);
//=> false
//開いたウィンドウを閉じれば
alert(myWin.closed);
//=> true

実際はグローバル変数とか微妙なので、せめてクロージャを使うとスマートだと思う。

やっつけなりに実装してみたソースは以下の如し。サンプルサイトもあるよ。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

function setOpener(){
  var myWin = null;
  var openOneAndOnlyWindow = function(e){
    if(e) e.preventDefault();
    if(!myWin || myWin.closed){
      alert("window does not exist!");
      myWin = window.open('http://blog.udzura.jp', 'mywindow1');
    } else {
      alert("window exists...");
    }
    return false;
  };
  return openOneAndOnlyWindow;
}
window.onload = function(){
  document.getElementById("opener_link").onclick = setOpener();
}
1
2
3
4
5
6
7

<html>
<body>
<script type="text/javascript" src="detect_window.js"></script>
 
<h1><a href="#" id="opener_link">Open Just One Window</a></h1>
</body>
</html>

ポップアップウィンドウが開いてる/閉じてる状態でリンクをクリックしたりして遊んでください。なお、ファイヤーフォックス（>=3.5.7）とインタネットエクスプローラ（>=7）でしか確認してません。

さらに言うと、僕は普段ろくにJavaScript書いてなかったりする（RJS便利だよRJS派）。。

参考サイト