Skip to main content

Visit Mozilla.org

DOM:window.open

出典: MDC


« Gecko DOM リファレンス

目次

[編集] 定義

新しい副ブラウザウィンドウを生成し、参照されているリソースをロードします。

[編集] 構文 

var win = window.open(url, name [, features]);

[編集] 戻り値とパラメータ

win 
新しく開かれた文書の window。何らかの理由でこのメソッドの呼びだしでウィンドウを開くことに失敗した場合、この値は null になります（例えば、ポップアップブロッカーがその window を開くことを妨げた場合）。
url 
新しく開かれるウィンドウでロードされる URL。
name 
<a> 要素や <form> 要素のターゲットの属性を文字列 "name" で指定したときにリンクやフォームのターゲットとして参照することができる新しいウィンドウの名前。文字列の引数には一切空白を含むべきではありません。name は新しいウィンドウのタイトルを指定するものではありません。
features 
オプションの引数。このパラメータは、新しいブラウザをウィンドウのリクエストされたウィンドウの特性（ウィンドウの機能やツールバー）をリスト化した文字列です。この文字列の引数は、空白スペースを一切含んではいけません。リクエストされたウィンドウの特性の各々は、文字列内においてコンマで区切られけばなりません。

[編集] 説明

open() メソッドは、新しい副ブラウザウィンドウを生成します。それは、ファイルメニューから新しいウィンドウを選ぶのに似ています。引数 url は、新しいウィンドウにおいてフェッチしロードする URL を指定します。url が空文字列の場合は、メインウィンドウのデフォルトツールバーを持った新しい空白の空のウィンドウ（URL は about:blank がロードされます）が生成されます。

リモート URL は、すぐにはロードされないことに注意してください。window.open() が戻り値を返すとき、ウィンドウは、常に about:blank を含んでいます。URL が実際にフェッチされるまでには猶予期間があり、現在のスクリプトブロックが実行を終えた後に開始されます。ウィンドウの生成と参照されるリソースの読み込みは、非同期に行われます。

[編集] 例 

var win;
var features = "menubar=yes,location=yes,resizable=yes,scrollbars=yes,status=yes";
function openRequestedPopup()
{
win = window.open("http://www.cnn.com/", "CNN_WindowName", features);
}

var win;

function openRequestedPopup()
{
win = window.open("http://www.domainname.ext/path/ImageFile.png",
    "DescriptiveWindowName",
    "resizable=no,scrollbars=yes,status=no");
}

name の名前を持っているウィンドウがすでに存在する場合は、新しいウィンドウが開かれる代わりに、url がその存在するウィンドウにロードされます。この場合において、そのメソッドの戻り値は、その存在するウィンドウであり、features は無視されます。url に空文字列を与えることは、ウィンドウのロケーションを変えずに、その名前によって開いたウィンドウの参照を得るための手段です。 window.open() の全ての呼びだしで新しいウィンドウを開きたい場合、name に _blank という特別な値を用いるべきです。

features は、新しいウィンドウに指定する特性をコンマで分割したリストを含む、オプションの文字列です。ウィンドウが開かれた後、ウィンドウの機能やウィンドウのツールバーを変えるために JavaScript を用いることはできません。name が存在するウィンドウを指定しなかった場合、かつ、引数 features を与えなかった場合（もしくは、引数 features が空文字列だった場合）は、新しい副ウィンドウにメインウィンドウのデフォルトのツールバーが表示されるでしょう。

引数 features が使用され、サイズの特性が定義されなかった場合は、新しいウィンドウの寸法は、最も最近に表示されたウィンドウの寸法と同じになります。

引数 features が使用され、位置の特性が定義されなかった場合は、新しいウィンドウの面の左と上の座標は、最も最近に表示されたウィンドウがあった位置から 22 ピクセル離れた位置になります。離す距離の設定は、ブラウザの製造者（デフォルトテーマでの MSIE 6 SP2 では 29 ピクセルです）によって普遍的に実装されます。そして、その目的は、ユーザに新しいウィンドウが開いたということに気づくのを助けることにあります。最も最近に使用されたウィンドウが最大化された状態である場合は、22 ピクセル離れた状態にはなりません。つまり、新しい副ウィンドウも同様に最大化されます。

引数 features を定義する場合、文字列として指定されずに、列挙されなかった特性は、無効になるか非表示になるでしょう。(デフォルトで yes である titlebar と close は除きます。)


Tip: 引数 features を使用する場合は、新しいウィンドウに含めたい特性のリストだけを指定するようにしてください。望むものだけが、有効に、もしくは、表示され、他のものは(デフォルトで yes である titlebar と close は除きます。)、無効、もしくは、非表示になるでしょう。

Firefox Chrome Toolbars Illustration

[編集] 位置とサイズの特性

位置と寸法のエラー修正についての注記

Bug 176320: Minimal innerWidth/innerHeight values for popup windows

優先度についての注記

left 
ユーザのオペレーティングシステムのアプリケーションのための作業領域の左端からブラウザウィンドウの左端ボーダー（リサイズハンドル）までの新しいウィンドウが配置される間隔を指定します。新しいウィンドウは、最初からスクリーン外に配置されることはありません。
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x, Opera 6+
top 
ユーザのオペレーティングシステムのアプリケーションのための作業領域の上端からブラウザウィンドウの上端ボーダー（リサイズハンドル）までの新しいウィンドウが配置される間隔を指定します。新しいウィンドウは、最初からスクリーン外に配置されることはありません。
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x, Opera 6+
height 
コンテンツエリア、新しい副ウィンドウのビューエリアの高さをピクセル単位で指定します。 高さの値は、水平スクロールバーが存在するならば、その高さを含めます。最小の要求値は 100 です。
outerHeight 対 height (or innerHeight) についての注記
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x, Opera 6+
width 
コンテンツエリア、、新しい副ウィンドウのビューエリアの幅をピクセル単位で指定します。 幅の値は、垂直スクロールバーが存在すれば、その高さを含みます。幅の値は、サイドバーが展開されていても、その幅を含みません。最小の要求値は 100 です。
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x, Opera 6+
screenX 
非推奨。left と同様ですが、Netscape と Mozilla ベースのブラウザでしかサポートされていません。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
screenY 
非推奨。top と同様ですが、Netscape と Mozilla ベースのブラウザでしかサポートされていません。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
centerscreen 
その親のサイズのと位置に関連付けられたウィンドウの中央。chrome=yes が必要。
outerHeight 
ブラウザウィンドウ全体の高さをピクセル単位で指定します。この outerHeight の値は、任意/全て のツールバーを含みます。この outerHeight の値は、ウィンドウの水平スクロールバー（存在する場合）と上と下のウィンドウリサイズボーダーを含みます。最小の要求値は、100 です。
注記: タイトルバーは常に表示されるので、outerHeight=100 を指定したとき、ブラウザウィンドウの innerHeight は、最小 100 ピクセル未満になります。
outerHeight 対 height (or innerHeight) についての注記
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
outerWidth 
ブラウザウィンドウ全体の幅をピクセル単位で指定します。この outerWidth の値は、任意/全て のツールバーを含みます。この outerWidth の値は、ウィンドウの垂直スクロールバー（存在する場合）と 左と右のウィンドウリサイズボーダーを含みます。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
innerHeight 
height と同じですが、Netscape と Mozilla ベースのブラウザでしかサポートされていません。コンテンツエリア、新しい副ウィンドウのビューエリアの高さをピクセル単位で指定します。innerHeight の値は、水平スクロールバーが存在するならば、その高さを含めます。最小の要求値は 100 です。
outerHeight 対 height (or innerHeight) についての注記
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
innerWidth 
width と同じですが、Netscape と Mozilla ベースのブラウザでしかサポートされていません。コンテンツエリア、新しい副ウィンドウのビューエリアの幅をピクセル単位で指定します。幅の値は、垂直スクロールバーが存在すれば、その高さを含みます。幅の値は、サイドバーが展開されていても、その幅を含みません。最小の要求値は 100 です。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x

[編集] ツールバーと chrome の特性

menubar 
この特性が yes に設定されている場合、新しい副ウィンドウにメニューバーが表示されます。
Mozilla と Firefox ユーザは、about:config か user.js ファイル（旧ページの日本語版）で、
dom.disable_window_open_feature.menubar
を true に設定することにより、常に新しいウィンドウにメニューバーを表示させるようにすることができます。
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
toolbar 
この特性が yes に設定されている場合、新しい副ウィンドウにナビゲーションツールバー（戻る、進む、更新、中止ボタンなどを配置できるバー）が表示されます。ナビゲーションツールバーに加えて、Mozilla ベースのブラウザには、タブバーが表示されるでしょう（親ウィンドウに存在し、表示されている状態である場合）。
Mozilla Firefox ユーザは、about:config か user.js ファイル（旧ページの日本語版）で、
dom.disable_window_open_feature.toolbar
を true に設定することにより、常に新しいウィンドウにナビゲーションツールバーを表示させるようにすることができます。
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
location 
この特性が yes に設定されている場合、新しい副ウィンドウに Mozilla ベースのブラウザではロケーションバーが、MSIE 5+ 及び Opera 7.x ではアドレスバーが表示されます。
Mozilla と Firefox ユーザは、about:config か user.js ファイル（旧ページの日本語版）で、
dom.disable_window_open_feature.location
を true に設定することにより、常に新しいウィンドウにロケーションバーを表示させるようにすることができます。

Firefox 3 における注記

Firefox 3 では、dom.disable_window_open_feature.location がデフォルトで true になっているので、IE7 のようにロケーションバーを強制的に表示します。 さらなる情報は、Bug 337344 を参照してください。

サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x, Opera 6+
directories 
この特性が yes に設定されている場合、新しい副ウィンドウに Netscape 6.x、Netscape 7.x、 Mozilla ブラウザでは、パーソナルツールバーが表示されます。Firefox 1.x では、ブックマークツールバーが表示され、MSIE 5+ では、リンクバーが表示されます。パーソナルツールバーに加えて、Mozilla ブラウザでは、サイトナビゲーションバーも表示されるでしょう（親ウィンドウに存在し、表示されている場合）。
Mozilla と Firefox ユーザは、about:config か user.js ファイル（旧ページの日本語版）で、
dom.disable_window_open_feature.directries
を true に設定することにより、常に新しいウィンドウに、パーソナルツールバー / ブックマークツールバーを表示させるようにすることができます。
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
personalbar 
directories と同じですが、Netscape と Mozilla ベースブラウザでのみサポートされています。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
status 
この特性が yes に設定されている場合、新しい副ウィンドウにステータスバーが表示されます。ユーザは、 全ての Mozilla ベースブラウザ、MSIE 6 SP2 (XP SP2 におけるステータスバーについての注記)、Opera 6+ において、ステータスバーの表示を強制させることができます。 最近の Mozilla ベースブラウザのリリース版及び Firefox 1.0 におけるデフォルト設定では、ステータスバーの表示を強制します。
ステータスバーについての注記
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x

[編集] ウィンドウの機能の特性

resizable 
この特性が yes に設定されている場合、新しい副ウィンドウがリサイズ可能になります。
Note: バージョン 1.4 から、Mozilla ベースのブラウザには、ステータスバーの右端にウィンドウをリサイズできるつまみ (grippy) があるので、web 制作者が副ウィンドウをリサイズ不可能に設定しても、ユーザがブラウザウィンドウをリサイズできることが保証されています。このとき、ウィンドウのタイトルバーの 最大化 / 元に戻す アイコンが非表示になり、ウィンドウの端でリサイズできなくなりますが、ウィンドウは依然としてステータスバーのつまみでリサイズ可能です。

Firefox 3 では、副ウィンドウは常にリサイズ可能になることが期待されています(bug 177838)。

Tip: アクセシビリティの観点から、この特性は常に yes に設定することが強く推奨されています。

Mozilla と Firefox ユーザは、about:config か user.js ファイル（旧ページの日本語版）で、
dom.disable_window_open_feature.resizable
を true に設定することにより、新しいウィンドウを常に容易にリサイズ可能にすることができます。
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
scrollbars 
この特性が yes に設定されている場合、新しい副ウィンドウに、水平 / 垂直スクロールバーの両方かいずれかが表示されます（文書がウィンドウのビューポート (viewport) に収まらない場合）。

Tip: アクセシビリティの観点から、この特性は常に yes に設定することが強く奨励されています。

Mozilla と Firefox ユーザは、about:config か user.js ファイル（旧ページの日本語版）で、
dom.disable_window_open_feature.scrollbars
を true に設定することにより、新しいウィンドウでこのオプションを常に有効にすることができます。
スクロールバーについての注記
サポートされるブラウザ: Internet Explorer 5+, Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
dependent 
この特性が yes に設定されている場合、新しいウィンドウが親ウィンドウに依存している状態になります。依存状態のウィンドウは親ウィンドウが閉じると閉じます。依存状態のウィンドウは、親ウィンドウが最小化されたときにのみ Windows のタスクバーに最小化されます。Windows プラットフォームでは、依存状態のウィンドウはタスクバーに表示されません。依存状態のウィンドウは、常に親ウィンドウの前面に表示されます。
依存状態のウィンドウは、MacOS X では、実装されていません。このオプションは無視されるでしょう。
依存状態の特性は現在の開発版では削除されています(bug 214867)。
MSIE 6 において、この特性に近いものは、showModelessDialog() メソッドです。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
dialog 
dialog 特性は、ウィンドウのタイトルバーから閉じるボタンを除いた全てのアイコン（元に戻す、最小化、最大化）を非表示にします。 Windows における Firefox と そのコマンドシステムメニューMozilla 1.2+ と Netscape 7.1 は、他のメニューシステムコマンドを表示するでしょう（FF 1.0 と NS 7.0x では、コマンドシステムメニューをタイトルバーの左端の Firefox/NS 7.0x のアイコンで呼びだすことができません。:これは恐らくバグです。タイトルバーを右クリックすることでコマンドシステムメニューにアクセスすることができます）。ダイアログウィンドウは、最小化システムコマンドアイコンと最大化 / 元に戻すシステムコマンドアイコンが、タイトルバーにもコマンドシステムメニュー内の代理メニューアイテム内にも表示されないウィンドウです。通常のダイアログと言われるものは、情報を通知するだけのもの、及び、退去時、閉じる時に表示されるものです。Mac システムにおける、ダイアログウィンドウでのウィンドウ端は異なっており、ダイアログはシートで代用されるかもしれません。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
minimizable 
この設定は、ダイアログウィンドウにだけ適用されます。つまり、"minimizable" を設定するには、dialog=yes が必須です。minimizable が yes に設定されている場合、新しいダイアログウィンドウには、「最小化」システムコマンドアイコンがタイトルバーに表示され、最小化可能となります。ダイアログウィンドウではないウィンドウは、常に最小化可能であり、 minimizable=no を無視します。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
fullscreen 
使用しないでください。Mozilla では実装されていません。Mozilla でこの特性を実装する予定はありません。
この特性は、 MSIE 6 SP2 においては、MSIE 5.x で動作した方法 では、もはや動作しません。MSIE 5.x で有効になっているときは、Windows のタスクバーは、ウィンドウのタイトルバーとステータスバー同様に、表示されませんし、アクセスも出来ません。
fullscreen は、広いモニタースクリーンやデュアルモニタースクリーンのユーザをいつも混乱させます。他のユーザに fullscreen を強制することは、いつも非常に不評であり、web 制作者の見方の設定をユーザに押し付けるのは、あからさまに不作法です。
fullscreen についての注記
サポートされるブラウザ: Internet Explorer 5+
fullscreen は、MSIE 6 SP2 では、正しく動きません。

[編集] 特権を必要とする特性

以下の特性は、 UniversalBrowserWrite 特権が必要です。特権がない場合、それらの指定は無視されます。Chrome で実行されるスクリプトには、自動的にこの特権が付加されます。それ以外の場合は、PrivilegeManager から特権のリクエストをする必要があります。

chrome 
注記: Mozilla 1.7/Firefox 0.9 から、この特性は、UniversalBrowserWrite 特権を必要とします（bug 244965）。
yes に設定されている場合、そのページには、ウィンドウのコンテンツだけがロードされ、ブラウザのインターフェース要素は一切表示されません。 デフォルトで定義されたコンテキストメニューも表示されず、標準のキーボードショートカットも機能しません。 そのページには、それ自身のユーザインターフェースが提供されなければならず、たいてい、この特性は、XUL 文書を開くために使われます（JavaScript コンソール のような標準のダイアログは、この方法で開かれます）。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
modal 
注記: Mozilla 1.2.1 から、この特性は、UniversalBrowserWrite 特権を必要とします（bug 180048）。 この特権が無ければ、この特性は無視されます。
yes に設定されている場合、その新しいウィンドウは、モーダルと呼ばれます。ユーザは、モーダルウィンドウが閉じられるまで、メインウィンドウに戻ることができません。典型的なモーダルウィンドウは、alert() メソッドによって、生成されます。
モーダルウィンドウの厳密な挙動は、プラットフォーム及び Mozilla のリリースバージョンに依存します。

Firefox 3 における注記

MSIE 6 において、この特性と同等のものは、showModalDialog() メソッドです。互換性の理由で、Firefox 3 でもこのメソッドがサポートされます。

サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
titlebar 
デフォルトでは、新しい副ウィンドウの全てにタイトルバーが表示されるようになっています。no に設定されている場合、この特性は、タイトルバーを新しい副ウィンドウで表示しないようにします。
Mozilla と Firefox ユーザは、about:config か user.js ファイル（旧ページの日本語版）で、
dom.disable_window_open_feature.titlebar
を true に設定することにより、新しいウィンドウに常にタイトルバーを表示させるようにすることができます。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
alwaysRaised 
yes に設定されている場合、 その新しいウィンドウは、アクティブかどうかに関わらず、常に他のブラウザウィンドウの最前面に表示されます。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
alwaysLowered 
yes に設定されている場合、その新しく生成されるウィンドウは、それ自身の親ウィンドウの下に表示されます。そのときの親ウィンドウは最小化されていない状態です。alwaysLowered 状態のウィンドウは、しばしば、ポップアップウィンドウとして参照されます。alwaysLowered 状態のウィンドウは最前面に表示させることはできませんが、親ウィンドウは最小化することができます。NS 6.x では、alwaysLowered 状態のウィンドウに「最小化」システムコマンドアイコンと「元に戻す/最大化」システムコマンドが表示されません。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x
z-lock 
alwaysLowered と同様です。
close 
no に設定されている場合、システムの「閉じる」コマンドアイコンとシステムの「閉じる」メニューアイテムが非表示になります。この特性は、ダイアログウィンドウ（dialog 特性が設定されている状態）でのみ動作します。
Mozilla と Firefox ユーザは、about:config か user.js ファイル（旧ページの日本語版）で、
dom.disable_window_open_feature.close
を true に設定することにより、新しいウィンドウで「閉じる」ボタンを常に表示させることができます。
サポートされるブラウザ: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x

位置とサイズの特性の要素は、数値を設定する必要があります。ツールバー、chrome、ウィンドウの機能の特性は、yes 、もしくは、no を設定することができます。ちなみに、yes の代わりに 1 を、no の代わりに 0 を使うこともできます。ツールバーと機能の特性の要素は、簡略形でも受け入れます。つまり、features の文字列に特性の名前を列挙するだけで特性を変更することができます。features の引数を与えた場合、titlebar と close は、依然として、デフォルト状態で yes です。しかし、yes/no の選択を持っている他の特性は、 デフォルト状態で no になり、無効状態に変更されるでしょう。

例: 

<script type="text/javascript">
var WindowObjectReference; // グローバル変数

function openRequestedPopup()
{
WindowObjectReference = 
window.open("http://www.domainname.ext/path/ImgFile.png",
   "DescriptiveWindowName",
   "width=420,height=230,resizable,scrollbars=yes,status=1");
}
</script>

この例では、開かれるウィンドウは、リサイズ可能で、必要ならば（コンテンツが指定したウィンドウの範囲からあふれた場合）、スクロールバーが表示され、そして、ステータスバーが表示されます。メニューバーとロケーションバーは表示されません。作者は、画像のサイズが、幅 400 ピクセル、高さ 200 ピクセル であることを知っていたので、上マージンが 15 ピクセル、下マージンが 15 ピクセル、左マージンが 10 ピクセル、右マージンが 10 ピクセルである MSIE 6 のルート要素に適用されるマージンを加えました。

[編集] ベストプラクティス 

<script type="text/javascript">
var WindowObjectReference = null; // グローバル変数

function openFFPromotionPopup()
{
  if(WindowObjectReference == null || WindowObjectReference.closed)
  /* メモリ内のウィンドウオブジェクトへのポインタが存在しないか、
     そのようなポインタが存在するが、そのウィンドウが閉じられている場合 */

  {
    WindowObjectReference = window.open("http://www.spreadfirefox.com/",
   "PromoteFirefoxWindowName", "resizable=yes,scrollbars=yes,status=yes");
    /* 真であれば、ウィンドウを生成。新しいウィンドウが生成され、
       他のウィンドウの最前面に移動します。*/
  }
  else
  {
    WindowObjectReference.focus();
    /* 偽であれば、ウィンドウへの参照は存在しなればならず、ウィンドウは
       閉じられていません。それゆえ、 focus() メソッドで他のウィンドウの
       最前面にそのウィンドウを移動させることができます。ウィンドウを再生成し、
       参照されているリソースを更新させる必要はありません。 */
  };
}
</script>

(...)

<p><a href="http://www.spreadfirefox.com/"
target="PromoteFirefoxWindowName"
onclick="openFFPromotionPopup(); return false;" 
title="このリンクは、新しいウィンドウを生成するか、すでに開かれているウィンドウを再利用します。">Firefox 採用の宣伝</a></p>

上記のコードは、副ウィンドウを開くリンクに関する、わずかなユーザビリティの問題を解決します。コード内の return false の目的は、リンクのデフォルトアクションをキャンセルすることです。: onclick イベントハンドラが実行される場合、リンクのデフォルトアクションを実行する必要はありません。しかし、ユーザのブラウザで javascript サポートが無効、もしくは、存在しない場合、onclick イベントハンドラは無視され、ブラウザは、target の "PromoteFirefoxWindowName" という名前のフレーム、もしくは、ウィンドウ内の参照されたリソースを読みこみます。"PromoteFirefoxWindowName" という名前のフレームもウィンドウも存在しない場合は、ブラウザは新しいウィンドウを生成し、そのウィンドウに "PromoteFirefoxWindowName" という名前を付けます。

target 属性の使い方の参考ページ:

HTML 4.01 Target attribute specifications（日本語訳）

How do I create a link that opens a new window?

関数をパラメタライズして、より多くの状況で機能する、多用途なものにすることもできます。そうすることで、スクリプト及びウェブページ内で、再利用可能なものになります。: 

var win = null;

function openRequestedPopup(url, name)
{
  if (win == null || win.closed)
    win = window.open(url, name, "resizable=yes,scrollbars=yes,status=yes");
  else
    win.focus();
}

<p><a href="http://www.spreadfirefox.com/" target="PromoteFirefoxWindow"
onclick="openRequestedPopup(this.href, this.target); return false;"
title="このリンクは、新しいウィンドウを生成するか、すでに開かれているウィンドウを再利用します。">Firefox 採用の宣伝</a></p>

この関数を、 副ウィンドウを 1 つだけ開くようにし、その単一の副ウィンドウをこの関数で開く他のリンクで再利用するようにすることもできます。: 

<script type="text/javascript">
var WindowObjectReference = null; // グローバル変数
var PreviousUrl; /* 副ウィンドウ内の現在の URL を
                    保存しているであろうグローバル変数 */

function openRequestedSinglePopup(strUrl)
{
  if(WindowObjectReference == null || WindowObjectReference.closed)
  {
   WindowObjectReference = window.open(strUrl, "SingleSecondaryWindowName",
         "resizable=yes,scrollbars=yes,status=yes");
  }
  else if(previousUrl != strUrl)
  {
   WindowObjectReference = window.open(strUrl, "SingleSecondaryWindowName",
      "resizable=yes,scrollbars=yes,status=yes");
    /* 読み込まれるリソースが異なる場合、
       それをすでに開かれている副ウィンドウに読み込み、
       そのウィンドウをその親ウィンドウの最前面に再移動します。 */
   WindowObjectReference.focus();
  }
  else
  {
    WindowObjectReference.focus();
  };
  PreviousUrl = strUrl;
  /* 説明: 現在の URL を保存し、この関数が再度呼び出されたときの
     URL と比較できるようにします。 */
}
</script>

(...)

<p><a href="http://www.spreadfirefox.com/"
target="SingleSecondaryWindowName"
onclick="openRequestedSinglePopup(this.href); return false;"
title="このリンクは、新しいウィンドウを生成するか、すでに開かれているウィンドウを再利用します。">Firefox 採用の宣伝</a></p>
<p><a href="http://www.mozilla.org/support/firefox/faq"
target="SingleSecondaryWindowName"
onclick="openRequestedSinglePopup(this.href); return false;"
title="このリンクは、新しいウィンドウを生成するか、すでに開かれているウィンドウを再利用します。">Firefox FAQ</a></p>

[編集] FAQ

どのようにすれば、ユーザにウィンドウを閉じるかどうか確認するメッセージを出さないようにすることができますか？
できません。 JavaScript によって開かれていない新しいウィンドウは、JavaScript によって閉じることは原則としてできません。 Mozilla ベースブラウザの JavaScript コンソールは、次の警告メッセージを出すでしょう。: "スクリプトはスクリプトによって開かれたウィンドウ以外を閉じることができません。" そうしなければ、ブラウザセッション中の訪問した URL の履歴が失われるでしょう。
詳細は、window.close() メソッドを参照してください。
どのようにすれば、ウィンドウを、最小化状態、あるいは、他のウィンドウの背後にある状態から復帰することができますか？
まず、対象ウィンドウのウィンドウオブジェクトへの参照が存在するかどうかを調べてください。それが存在し、かつ、閉じてしまっていない場合は、focus() メソッドを使用してください。他に確実な方法はありません。focus() メソッドの使用方法を説明している例 でテストすることができます。
どのようにして、最大化したウィンドウを強制させるのですか？
できません。全てのブラウザ制作者は、新しい副ウィンドウが開くことを、ユーザを混乱させずに、ユーザに気づかせることができるように努力しています。
どのようにすれば、ウィンドウのリサイズを無効にしたり、ツールバーを非表示にできますか？
これを強制することはできません。Mozilla ベースのブラウザのユーザは、about:config における ユーザ設定で、リサイズ、スクロール、ツールバーの表示を自らコントロールできます。 あなたのユーザはそのウィンドウを使うであろう一人に過ぎない（ウェブ制作者であるあなたではありません）ので、最も良いのは、彼らの習慣や設定に干渉することを避けることです。推奨する方法は、コンテンツへのアクセシビリティとウィンドウのユーザビリティを保証するために、リサイズとスクロールバーの表示を（必要ならば） 常に yes に設定することです。これは、ウェブ制作者とそのユーザの両者のとって最も有益な方法です。
どのようにすれば、ウィンドウをコンテンツに合うようにリサイズできますか。
確実にはできません。なぜなら、ユーザは、Mozilla では、
編集/設定/詳細/スクリプトとプラグイン/以下のスクリプトを許可/ウィンドウの移動または大きさの変更
のチェックボックスをチェックしないことによって、Firefox では、
ツール/オプション.../コンテンツ タブ/Javascript を有効にする/詳細設定 ボタン/ウィンドウの移動または大きさの変更
のチェックボックスをチェックしない、あるいは、about:config かuser.js ファイル（日本語版）で、
dom.disable_window_move_resize
を true に設定することで、ウィンドウがリサイズされないようにすることができるからです。
一般に、ユーザは、たいてい、ウィンドウの移動またはリサイズを無効にしています。その理由は、過去に、制作者のそのようなスクリプトを許可することで、大変な弊害を受けており、この特性を濫用しない、めったにないスクリプトでも、ウィンドウをリサイズするときに、間違ったリサイズをしばしば行うからです。これらのスクリプトの 99% は、ウィンドウのリサイズを不可能にしたり、スクロールバーを非表示にします。そのような場合、本来は、それらのスクリプトの計算が間違っている場合のための、用心深く、分別のある代替の仕組みとして、それらの特性の両方が有効であるべきです。
window オブジェクトのメソッドである、sizeToContent() メソッドもまた、ユーザが、設定の ウィンドウの移動または大きさの変更 のチェックボックスをチェックしないことにより、無効化されます。スクリプトによるユーザ画面上における遠隔操作的なウィンドウの移動または大きさの変更は、大変非常にユーザをいらいらさせるでしょうし、ユーザの頭を混乱させるでしょうし、最も間違っていることでしょう。そのようなウェブ制作者は、架空のユーザのブラウザウィンドウのあらゆる位置とサイズのアスペクトの完全なコントロールを期待しています（し、決めつけています）。
どのようにして、リンク先の参照リソースを新しいタブ、あるいは、指定したタブに開くのですか？
現在のところ、できません。ユーザだけが自身の詳細設定でそうするように設定することができます。Mozilla ベースのブラウザである、K-meleon 1.1 は、どのようにリンクを開くかに関する完全な管理と選択肢をユーザに与えています。いくつかの高度な拡張も、Mozilla と Firefox にどのように参照リソースをロードするかに関する多くの選択肢を与えます。
ここ数年の間に、CSS3 ハイパーリンクモジュールの target プロパティ（日本語訳） が実装されるかもしれません（CSS3 ハイパーリンクモジュールが承認された場合）。そうなった場合、タブブラウザ制作者がユーザにどのようにリンクからウェブページを開くことができるかに関する完全に拒否する権利と完全な管理を与えることを期待できます。どのようにリンクを開くかは、常に、完全にユーザの管理下にあるべきです。
どんなようにして、開いたウィンドウがまだ開かれているかどうかを知るのですか？
ウィンドウオブジェクトへの参照が存在するかどうかをテストできます。それは、window.open() メソッドの呼び出しが成功した場合の戻り値です。また、WindowObjectReference.closed プロパティの値の戻り値が false であるかどうかを調べることでもできます。
どのようにすれば、ウィンドウがポップアップブロッカーによってブロックされていることを伝えることができますか？
Mozilla/Firefox と Internet Explorer 6 SP2 の組み込みポップアップブロッカーでは、window.open() の戻り値を調べる必要があります。ウィンドウが開くことが許可されなかった場合の戻り値は、null です。しかし、多くの他のポップアップブロッカーに対しては、そのような方法はありません。
主ウィンドウと副ウィンドウの JavaScript の関係は？
window.open() メソッドと opener プロパティの戻り値です。WindowObjectReference は、opener キーワードが副ウィンドウをそれの主ウィンドウ（開く側 (opener) ）へつなげている間、主ウィンドウ（開く側）を副ウィンドウ（サブウィンドウ）へつなげています。
新しい副ウィンドウのプロパティにアクセスできません。JavaScript コンソールに、"Error: uncaught exception: Permission denied to get property <プロパティ名 or メソッド名>." というエラーが常に出ます。なぜそのようになるのですか？
それは、クロスドメインスクリプトセキュリティの制限（"同一生成元ポリシー"とも）のためです。異なった生成元（ドメイン名）からウィンドウ（あるいは、フレーム）にロードされるスクリプトは、別ウィンドウ（あるいは、フレーム）のプロパティ、または、別の異なった生成元（ドメイン名）由来の HTML オブジェクトの取得も設定もできません。それゆえ、主ウィンドウのブラウザは、副ウィンドウをターゲットとしたスクリプトを実行する前に、副ウィンドウが同じドメイン名を持っているかどうかを調べるでしょう。
クロスドメインスクリプトセキュリティ制限については、以下で詳細を参照してください。: http://www.mozilla.org/projects/security/components/same-origin.html（日本語版）

[編集] ユーザビリティの問題

[編集] window.open() への依存を回避する

一般的に言えば、いくつかの理由で、window.open() への依存を回避することを選択するべきです。:

  • 全ての Mozilla ベースのブラウザは、タブブラウジングを提供しています。タブブラウジングは、参照するリソースを開くときに（ウィンドウを開くよりも）よりましな形態です。…これは、Mozilla ベースのブラウザだけでなく、他のタブブラウジングを提供しているブラウザの全てにおいていえることですが。言い換えれば、タブ機能を持つブラウザのユーザは、全般的に、ウェブページを見るときのほとんどの場面で、新しいウィンドウで開くよりも、新しいタブで開く方を好むということです。過去3年の間に、インターネット上でのタブ機能を持つブラウザへの支援と熱狂的な支持は、劇的な速度で拡大しました。そして、この流行は、逆戻りすることはないでしょう。2006 年 10 月にリリースされた MSIE 7 は、タブブラウジングを完全にサポートしています。
  • Multizilla のような いくつかの Mozilla の拡張 と Tabbrowser preferences のような Firefox の拡張 が現在存在しますが、それらの機能、設定、詳細な設定は、タブブラウジングを基本とし、また、window.open() の呼び出しを、タブとして開くことに置き換える、または、（特に、リクエストされていない新しいウィンドウを開く場合）無効化すること（リクエストされていないポップアップをブロックすること、もしくは、スクリプトで自動的に開かれるウィンドウをブロックすることがそれにあてはまります）を基本としています。 それらの拡張の機能には、リンクを新しいウィンドウで開くかどうか、同じウィンドウに読み込むかどうか、新しいタブで開くかどうか、"バックグラウンド" で開くかどうかというような設定が含まれています。むやみに新しいウィンドウを開くようにコーディングしても、もはや上手く動作する保証はありませんし、強制的に上手く動作させることもできません。そのようなことをした場合、大多数のユーザの反感を買うことになるでしょう。
  • 新しいウィンドウでは、メニューバーが非表示になったり、スクロールバーが非表示になったり、ステータスバーが非表示になったり、ウィンドウのリサイズができなくなるようになる可能性などがあります。しかし、新しいタブは、それらのバーや機能、ツールバー（少なくとも、デフォルトで存在しているツールバー）が無くなることはありません。それゆえ、タブブラウジングは、多くのユーザに好まれます。タブを利用することで、ユーザが好むブラウザウィンドウの通常のユーザインタフェースが完全な状態を維持し、安定した状態が保たれるからです。
  • 新しいウィンドウを開くことは、ウィンドウの機能を削ったとしても、考慮しなければならないほど多くのユーザのシステムリソース（CPU、RAM）を使用し、考慮しなければならないほどの多くのコーディングをソースコードにおいて伴います（セキュリティ管理、メモリ管理、ときどきかなり複雑になる様々なコードブランチ、ウィンドウのフレーム/chrome/ツールバーの構築、ウィンドウの位置調整及び大きさの調整など）。新しいタブを開くことは新しいウィンドウを開くよりもユーザのシステムリソースの要求が少なくてすみます（そして、実装がより迅速です）。

[編集] リンクを新しいウィンドウに開くことを提供する場合、以下のガイドラインを使用してください

リンクを新しいウィンドウで開くことを提供したい場合、テストされ、推奨できる、ユーザビリティとアクセシビリティのガイドラインに従うべきです。:

[編集] 決して リンクに次の形式のコードを使わない:
<a href="javascript:window.open(...)" ...>

"javascript:" 形式のリンクは、全てのブラウザにおいて、ウェブページのアクセシビリティとユーザビリティを損ねます。

  • "javascript:" 疑似リンクは、JavaScript サポートが無効化、もしくは、存在しない場合、障害的な機能となります。企業によっては、従業員にウェブの閲覧を許可していても、それが厳格なセキュリティポリシーで管理されている場合があります。例えば、JavaScript 有効の禁止、Java の禁止、Active X の禁止、Flash の禁止などです。様々な理由で（セキュリティ、共用アクセス、テキストブラウザ、など…）、ユーザの 5%～10% が、JavaScript を無効化にしてウェブを閲覧しています。
  • "javascript:" 形式のリンクは、タブ機能があるブラウザの高度な機能を妨害する可能性があります。例えば、リンクのミドルクリック、リンクの Ctrl + クリック、拡張におけるタブブラウジングの機能などです。
  • "javascript:" 形式のリンクは、検索エンジンによるウェブページのインデックス処理を妨害する可能性があります。
  • "javascript:" 形式のリンクは、ボイスブラウザなどの支援技術 (assistive technologies) と PDA や モバイルブラウザなどのいくつかの Web-Aware アプリケーションを妨害します。
  • "javascript:" 形式のリンクは、ブラウザに実装された "マウスジェスチャ" 機能も妨害します。
  • プロトコルスキーマとしての "javascript:" は、link Validator 及び リンクチェッカーでは、エラーとして報告されます。

参考 URL:

[編集] 決して <a href="#" onclick="window.open(...);"> を使わない

そのような疑似リンクもリンクのアクセシビリティを損ねます。常に href 属性値を持つ本来の URL を使ってください。 そうすれば、JavaScript サポートが無効にされていたり、存在しない場合や、 MS-Web TV や、テキストブラウザなどのようなユーザエージェントが副ウィンドウを開くことをサポートしていない場合でも、そのようなユーザエージェントが、それらがサポートするデフォルトの方法に従って参照されるリソースを読みこむことができます。また、この形式のコードは、タブ機能を持つブラウザの高度な機能を妨害します。例えば、リンクのミドルクリック、リンクの Ctrl + クリック、リンクの Ctrl + Enter、"マウスジェスチャ" 機能です。

[編集] 新しい副ウィンドウを生成（もしくは再利用）するリンクを常に識別できるようにする

リンクの title 属性を記述したり、リンクの最後にアイコンを追加したり、反応するカーソルを記述することによってユーザに情報を与え、新しいウィンドウを開くことになるリンクを識別できるようにしてください。

ユーザに警告をする目的は、コンテキストが変化するときに、ユーザの混乱を最小限にするためです。現在のウィンドウが変化したり、新しいウィンドウがポップアップすることは、ユーザを混乱させます（ツールバーボタンの戻るは使えません）。

"ユーザが新しいウィンドウが開いたことに気づかないことはけっこうあります。特に、小さなモニターを使用していて、ウィンドウが最大化されている場合です。元のページに戻ろうとするユーザは、 Back ボタンがグレーアウトしているので、混乱してしまいます。"
引用元：The Top Ten New Mistakes of Web Design: 2. Opening New Browser Windows, Jakob Nielsen, May 1999（日本語版）

コンテキストにおける急激な変化が発生する前にそれらが明確に示唆されるとき、ユーザは、そのまま進みたいかどうかを決めることができ、変化に対して準備することができます。ユーザを混乱させないだけでなく、より経験豊富なユーザは、そのようなリンクをどのように開くかに対するより良い決定を下すこともできます（新しいウィンドウとして開くかどうか、同じウインドウに読み込むか、新しいタブに開くどうか、"バックグラウンド" で開くかどうか）。

リファレンス

"新しいウィンドウ" を示すアイコンとカーソルの例
yahoo.com の新しいウィンドウアイコン microsoft.com の新しいウィンドウアイコン webaim.org の新しいウィンドウアイコン sun.com の新しいウィンドウアイコン
bbc.co.uk の新しいウィンドウアイコン Accessible Internet Solutions の新しいウィンドウアイコン accessify.com の新しいウィンドウアイコン webstyleguide.com の新しいウィンドウアイコン
ソース不明の新しいウィンドウアイコン ソース不明の新しいウィンドウアイコン ソース不明の新しいウィンドウアイコン gtalbot.org の新しいウィンドウアイコン
draig.de の新しいウィンドウカーソル mithgol.ru の新しいウィンドウカーソル

[編集] 常に target 属性を使う

JavaScript サポートが無効化されている、もしくは、存在しない場合、ユーザエージェントは、自身の target 属性の扱い方に従って、副ウィンドウを生成するか、参照されるリソースを表示するでしょう。例えば、MS Web TV のような、新しいウィンドウを生成できないいくつかのユーザエージェントは、参照されたリソースを取りだしてから、それを現在のウィンドウの最後に追加します。その最終目的と考え方は、ユーザに参照されるリソースを開く方法、つまり、リンクを開く形式を提供しようとすることであり、 - 強制することではありません。 - あなたのコードはユーザが自由に選択できるブラウザの機能を妨害すべきではありませんし、ユーザに与えられる最終決定権を妨害すべきではありません。

[編集] target="_blank" を使わない

target 属性には常に意味のある名前を指定し、あなたのページでそのような target 属性を再利用するようにしてください。そうすれば、別のリンクをクリックしても、参照されるリソースがすでに生成され、表示されているウィンドウに読みこまれることになるでしょう（そうすることで、ユーザ側の処理がスピードアップします）。また、そうすることで、副ウィンドウを最初の場所に生成する理由（とユーザのシステムリソース、時間消費）が正当化されるでしょう。単一の target 属性値を使用し、それをリンクで再利用することは、再利用される単一の副ウィンドウを生成するよりも、非常にユーザリソースに優しいことです。一方、target 属性の値として、"_blank" を使用すると、いくつかの新しい、名前のないウィンドウをユーザにデスクトップに生成することになり、それらは、再利用も、再使用もできません。どんな場合でも、あなたのコードが上手く動作する場合でも、ユーザの最終選択を妨害するべきではありません。そうではなく、より多くの選択肢、リンクを開くためのより多くの方法、ユーザが使用しているツール（ブラウザ）へのより多くの機能をユーザに提供するようにしてください。

[編集] 用語

開く側のウィンドウ (Opener window) 、親ウィンドウ (parent window) 、主ウィンドウ (main window) 、第 1 ウィンドウ (first window)  
これらの語は、同じウィンドウのことを記述、または、指し示すために使われています。これは、新しいウィンドウが生成される元ウィンドウのことです。つまり、これは、ユーザが別の新しいウィンドウを生成するためのリンクをクリックした際の元ウィンドウのことです。
サブウィンドウ (Sub-window) 、子ウィンドウ (child window) 、副ウィンドウ (