サブウインドウ内にあるボタンをクリックして元のウインドウの背景色を変更します。他のページを読み込んでもこのコントローラーは機能します。
応用 :
たとえばdocument.bgColor="pink"の色を口絵のカラーチャートで調べて好きな色に変えて見ましょう。どんな暗いページでもこれで手軽に明るくしてみることができます(^^)v。 ウインドウについて詳しくはwindow.openの参照をご覧ください。Mac版NN2.0とUNIX版3.0までのバージョンのbgColorにはバグがあります。
バグ回避はこちら
参照 : function, 変数, window.open, opener, document.write(), document.bgColor, document.close(), onClick,
<html> <head> <title></title> <script language="JavaScript"> <!-- //背景色変更 function changecl(color){ document.bgColor=color } //サブウインドウオープン function WinOpenF02(){ var WinF02= window.open('','WinNameF02','scrollbars=1,resizable=1,width=180,height=220') html = '<font size=5 color="green">背景色<br>コントローラー</font>' html += '<table border=5 width=10%><tr><td></td></tr></table>' html += '<form>' html += '<input type="radio" name="" onClick=opener.changecl("pink")>-pink<br>' html += '<input type="radio" name="" onClick=opener.changecl("lime")>-lime<br>' html += '<input type="radio" name="" onClick=opener.changecl("plum")>-plum<br>' html += '</form>' WinF02.document.write(html) WinF02.document.close() } //--> </script> </head> <body> <form> <input type="button" value=" 背景色コントローラー " onClick="WinOpenF02()"><br> </form> </body> </html>
window.openに関する説明はwindow.openをご覧くださいonClick="命令文"でクリックしたら"命令文"を実行するという意味です
ここでは、たとえばonClick="WinOpenF02()"で関数WinOpenF02()のなかに書かれた命令を実行します
html ='文字列1'で変数htmlへ'文字列1'を入れています。次のhtml +='文字列2'は、はじめに入れた'文字列1'へ続けて'文字列2'を格納します。この後、変数html は'文字列1文字列2'という連続した文字を意味するようになります
WinF02.document.write()でサブウインドウWinF02に、ボタンなどのHTMLを書き出ています
opener.changecl("色")で元ウインドウ(opener)の関数changecl()を起動して指定した"色"で背景色を書き換えます
document.bgColor="色"で背景色を書き換えます。色の指定はpinkやredなどのカラーバリューや"#000000"(黒)や"#ffffff"(白)などのRGBで行います
WinF02.document.close()はサブウインドウWinF02内の文字などの書き出しを終了するという意味です。これを忘れると文字が欠けることがあります
| CONTENTS
| PART1 これだけ知っていれば大丈夫
| PART2 サンプルの紹介
| PART3 JavaScript言語仕様
| PART4 JavaScriptクイック書式一覧
| PART5 JavaScriptサイト
| オンラインサポートページ(回線をつないでください)