別ウインドウを開く・閉じる
 
リンクを開くと別ウインドウが開くページありますよね。
通常はタグだけでこんな感じで書きます。
<a href="XXXXXX.html" target="_blank">


このように<a>のtarget属性に_blankをセットすればOKです。
ですが、ボタンを押して別ウインドウを開く場合、JavaScriptを使うのが普通です。やっていることは<a>と基本的に同じです。

ではまずボタンを記述してみましょう。

<form>
<ijnput type="button" value="開く">
</form>

次にJavascriptを記載します。
前回は<script>を使ってJavaScriptを動作させたい場所に記載しました。
今回はボタンを押すことをトリガーとしてJavaScriptが動作するようにします。
ボタンを押したことで動作するようには、
<input type="button" value="開く" onclick="XXXXXX">
というようにonclick属性を<input>に書き込みます。
で、XXXXXXの部分にJavaScriptの命令を入れます。
ウインドウ関係はwindowオブジェクトを使います。そしてopenメソッドでウインドウを開きます。
openメソッドは引数としてウインドウのサイズやメニューのあるなしなどを指定できますが、今回はシンプルに開くページのみを指定します。あと、開くウインドウに名前をつける必要があるのですが、これは_blankで構いません。
<form>
<input type="button" value="開く" onClick="window.open('js02-sample.html', '_blank');">
</form>
これでボタンを押すと別ウインドウが開きます。
実際にやってみましょう。
うまく開きましたか？

今度はウインドウを閉じてみましょう。
これはcloseメソッドを使います。

<form>
<input type="button" value="閉じる" onClick="window.close();">
</form>

これでウインドウを閉じることができます。
先程開いたウインドウに閉じるボタンがありますので、試して下さい。

このようにJavaScriptでウインドウを開いたり閉じたりできます。皆さんも活用してみて下さい。
Webメニューへ