イベントハンドラは、ユーザのアクションに合わせてJavaScriptのコードを 呼び出す仕組みです。例えば、マウスでボタンをクリックした時に、特定の JavaScriptコードを実行するなどというのは、典型的なイベントハンドラの 例です。
<タグ イベントハンドラ名="実行されるJavaScriptコード">
例えば、ボタンがクリックされた時に、JavaScriptコードを呼び出すには、以下のように記述します。
<INPUT type="BUTTON" name="OKBTN" onClick="実行したいJavaScriptコード">
通常は、実行するJavaScriptコードは、HTMLヘッダーに定義しておいた関数名に する場合が多いです。
| イベントハンドラ名 | 呼び出されるタイミング |
|---|---|
| onBlur | フォームの要素がフォーカスを失った時。 |
| onClick | フォーム要素やリンクがクリックされた時。 |
| onChange | テキストやリストの値が変わった時。 |
| onFocus | フォーム要素がフォーカスを得た時。 |
| onLoad | HTMLページがロードされた時。 |
| onMouseOver | リンクやアンカーの上をマウスが通過した時。 |
| onSelect | フォームの選択オブジェクトが選択された時。 |
| onSubmit | フォームがサブミット(提出)された時。 |
| onUnload | 別のページをロードしようとした時。 |
上記のようなイベントハンドラを利用できるオブジェクトも、予め決められています。どのオブジェクトがどのイベントハンドラを利用できるのかは、以下のようになっています。
| オブジェクト | 利用できるハンドラ |
|---|---|
| button | onClick |
| document | onLoad, onUnload |
| form | onSubmit |
| frameset | onLoad, onUnload |
| link | onClick, onMouseOver |
| radio | onClick |
| reset | onClick |
| select | onBlur, onChange, onFocus |
| submit | onClick |
| text | onBlur, onChange, onFocus, onSelect |
| textarea | onBlur, onChange, onFocus, onSelect |
| window | onLoad, onUnload |