イベントはマウスのボタンがクリックされた、ページの読み込みが完了した、フォームの選択メニューが変更された、など何かしらの動作が起こったときに発生します。このイベントを取得するのがイベントハンドラです。たとえば、フォームのボタンなどがクリックされたときのイベントハンドラはonclickになります。
スポンサーリンク
イベントでスクリプトを実行する
イベントハンドラをHTML/XHTMLの要素の属性（イベント属性）やオブジェクトに設定し、JavaScriptの処理を呼び出すようにすれば、指定の動作が起こったときに設定した処理を実行させることができます。その際、「;」（セミコロン）で区切れば複数の処理を指定できます。
イベント属性を利用する
HTML/XHTML要素の属性を利用し、実行するJavaScriptの処理を「””」（ダブルクォーテーション）で囲って指定する方法です。
スポンサーリンク
// ページの読み込み完了イベント（onload）。
// ページの読み込み完了時にalert(‘ようこそ’)が実行されます。
<body onload=“alert(‘ようこそ’)”>
// ページの読み込み完了時にalert(‘ようこそ’)が実行されます。
<body onload=“alert(‘ようこそ’)”>
// クリックイベント（onclick）。ボタンをクリックするとalert(‘最初の処理’)が実行されます。
// ダイアログの「OK」ボタンをクリックするとalert(‘次の処理’)が実行されます。
<input type=”button” value=”Click!” onclick=“alert(‘最初の処理’);alert(‘次の処理’);”>
// ダイアログの「OK」ボタンをクリックするとalert(‘次の処理’)が実行されます。
<input type=”button” value=”Click!” onclick=“alert(‘最初の処理’);alert(‘次の処理’);”>
スクリプト中に設定する
HTML/XHTMLのイベント属性を利用せず、JavaScriptでイベントハンドラの内容を直接指定する方法です。通常、関数の呼び出しには関数名の後ろに()が必要ですが、この場合()は不要です。
function myFunc() {
alert(“シェイクスピア「ハムレット」から”);
return false;
}
document.getElementById(“test”).onmouseover = myFunc;
alert(“シェイクスピア「ハムレット」から”);
return false;
}
document.getElementById(“test”).onmouseover = myFunc;
スポンサーリンク
