イベントハンドラを使う/JavaScript講座

■ イベントハンドラを使う

JavaScriptでは、HTML文書の読み込み時に自動的にプログラムを実行させる方法のほか、イベントハンドラを使用してさまざまなイベント発生時に自動的に任意のプログラムを実行することができます。

イベントとは、マウスのクリックなどユーザがブラウザ上で行うさまざまな動作をした際に発生するもので、ブラウザはこれを監視します。JavaScriptでは、これらイベントをハンドリングするためのイベントハンドラとして、下記のようなものを用意しています。

■ イベントハンドラ一覧

イベントハンドラとその機能
ハンドラ名	内容	利用可能な場所
onBlur	フォームがフォーカスを失う際に起動	select、text、textarea
onChange	フォームの内容が変更され、フォーカスを失った際に起動	select、text、textarea
onClick	フォームがクリックされた際に起動	button、checkbox、radio、link、reset、submit
onFocus	フォームがフォーカスされた際に起動	select、text、textarea
onLoad	ページがロードされた際に起動	body要素内で定義する
onMouseOver	マウスカーソルが重なった際に起動	link
onSelect	フォーム内でテキストが選択された際に起動	text、textarea
onSubmit	submit（提出）された際に起動	form
onRest	reset（取り消し）された際に起動	form
onUnload	ページがアンロードされた際に起動	body要素内で定義する

表を見ただけでは、何をしたいときにどのような方法で、どのイベントハンドラを使うのか良く分からないかもしれませんが、サンプルを用意していますので、それを参照して自分なりに工夫してください。

なお、ここに掲げたイベントハンドラは、ほんの一例です。詳しくは、イベント属性をご覧ください。

初版更新日 2002年7月14日最新更新日 2003年4月30日