Chapter 05 「イベント」
■マウスイベントをキャッチ!
ここではマウスイベントをキャッチして計算させたりメッセージを表示させましょう。マウスイベントはたくさんありますが、mouseoverイベントを使ってみましょう。このイベントは名前の通り「オブジェクトにマウスが乗った」時に発生します。タグ内にイベントを書く場合は以下のようになります。
<@タグ名 Aイベント名="BJavaScriptのプログラム">
@A, BODY, DIVなどのタグ名を書きます。
AonMouseover, onClick, onKeydownなどのイベント名を書きます。
BJavaScriptのプログラムを書きます。
イベント名は発生するイベント名の前にonを付けます。clickであればonClick、keydownであればonKeydownとなります。(以後、発生するイベントにはonMouseoverのようにonを付加して説明します)
onMouseoverイベントを使って12+34の結果をアラートダイアログ表示させるには以下のように書きます。
表示
Cマウスが表示の文字の上に重なったら12+34の結果を表示します。
これで文字の上にマウスポインタが重なるとonMouseoverイベントが発生してアラートダイアログに12+34の結果である46が表示されます。12+34の代わりにメッセージを表示するには以下のように書きます。
表示
Dマウスが表示の文字の上に重なったらこんにちは、と表示します。
注意しなければならないのは""で囲まれている場合には''を使って文字列を囲まないといけない点です。"で囲んでしまうとエラーになってしまいます。どうしても"でないと駄目な場合は以下のように\"と書きます。
表示
E"を表示したい時には\"のように書きます。
タグにonMouseoverイベントを書きましたが、タグにも書くことができます。タグ同様に以下のように書きます。
画像の上にマウスポインタが乗るとアラートダイアログにメッセージが表示されます。
●リスト1