Javascript でポップアップウィンドウを開く方法と親ウィンドウへリンクを飛ばす方法

Javascript でポップアップウィンドウを開いて、開いたポップアップウィンドウの中にあるリンクをクリックするとメインウィンドウのページが切り替わる方法と、IE と Firefox の動作の違いをメモしました。誰かの参考になれば幸いです。

Javascript でポップアップウィンドウを開く方法

JavaScript: ポップアップウインドウの開き方 | Bowz::Notebook を参考にすると以下のような感じ。

1
<a href="javascript:window.open('popup.html','windowname','width=350,height=450');">開く</a>

でもこの方法だと Javascript を on にしていないとリンク先が開けないので、以下のように記述すると開けるようになったり、右クリックからのいろいろな操作ができるようになったりするそうです。
でも Javascript を on にしていない人なんてそういないだろうと思いますので、以下はここだけでの話ということで…。

1
<a href="popup.html" onClick="javascript:window.open('popup.html','windowname','width=350,height=450');return false;">開く</a>

Firefox ではこのままだとポップアップウィンドウを開いた後に [object Window] が表示されてしまうと思うので、スクリプトの末尾に void(0); を追加することで回避できます。
でいご堂日記 | [Firefox] Javascript の window.open で [object Window] が表示されるときは

1
<a href="javascript:window.open('popup.html','windowname','width=350,height=450');void(0);">開く</a>

ポップアップウィンドウのリンクを親ウィンドウに飛ばす

ポップアップで開いたサブウィンドウ内にあるリンクを親ウィンドウで表示させるには、いろいろ方法があります。
JavaScript/ウィンドウ/サブからメインウィンドウを操作する – TAG index Webサイト
教えて! Watch ポップアップから親ウィンドウへリンクを飛ばす?
私の場合は親ウィンドウへ名前を付けて、target 属性で親ウィンドウに付けた名前を指定して開く方法でやりました。

1. まず以下のようにしてメインウィンドウに名前を付けておきます。

1
2
3
4
5
<script language="JavaScript">
<!--
self.name="MainWindow";
-->
</script>

2. 開いたウィンドウ内に表示するリンクは以下のような感じです。

1
<a href="content.html" target="MainWindow">テキスト</a>

Firefox でしかテストしていないので、心配ですが多分いけると思います。
あと、以下もちょっと気になります。また今度まとめの続き書きますね。
[J] a タグの href に # とか javascript:void(0) とかする理由 – Jamz (Tech)

コメント

コメントは受け付けていません。