11月14日開講web制作科
formとJavaScriptを組み合わせる
formとJavaScriptを組み合わせる事によって、CGIを使わなくても、動的な動きを実現する事ができます。Webページが表示されたり、リンクがクリックされたりといった様々なイベント発生時の処理をイベントハンドラと言います。Webページ読み込み時の処理(onLoad)
<body onLoad="処理">
googleMap APIを導入してみます。APIを読み込ませるため、bodyタグにonLoadを記述します。
サンプル
※注 initialize () 関数
この関数が記述された Scriptノードがロードされた直後に、全てのイベントに先だって自動実行されます。
クリック時の処理(onClick)
<input type="button" onClick="処理"> <input type="radio" onClick="処理"> <a href="...." onClick="処理">
このonClickを利用した処理に、パスワードを入力して秘密のページに飛ぶ事ができます。暗号化などを使用していなくても、ページ名を指定しておけば、ページ名を入力した場合のみ遷移するので便利です。下記のサンプルでは、kikin.htmlが飛びたいページの名前なので、ボタンをクリックで現れたポップアップウィンドウにkikinと入力します。
サンプル
フォーム変更時の処理(onChange)
<select name="name" onChange="処理"> <option value="val1">option_val1</option> <option value="val2">option_val2</option> </select> <input type="radio" name="name" value="val1" onChange="処理">str1 <input type="radio" name="name" value="val2" onChange="処理">str2
