トップ 言語 JavaScript 入門編 イベントとイベントハンドラ

JavaScriptのイベントとイベントハンドラ―具体的な活用例など

具体的な活用例など。JavaScriptのイベントハンドラについてまとめています。

イベントとイベントハンドラ

「フォームボタンのクリック」というような処理の起点となる出来事をイベントといいます。 そして、そのイベントの処理を実行する仕組みをイベントハンドラといいます。

JavaScriptイベントハンドラの例

ここでは、ボタンをクリックする(イベント)とアラートダイアログが出力(イベント処理)されるサンプルプログラムを紹介します。

サンプルソース

<html>
<head>
<meta http-equiv="Content-Script-Type"
                          content="text/javascript">
</head>
<body>

<input type="button" value="ボタン"
    onclick="alert('アラートダイアログ');">

</body>
</html>

表示方法と表示結果

htmlファイルに保存して、ChromeやFirefoxなど、ブラウザで開けば表示できます。 表示した結果は次のようになります。

ボタンが表示されます。

JavaScriptイベントハンドラの例―表示

ボタンを押下するとイベントが発生し、イベントハンドラが記述した処理を呼び出し、アラートダイアログが表示されます。

JavaScriptイベントハンドラの例―ボタン押下後

ポイント

イベントハンドラを使うときは、以下のmetaタグを記述します。

<meta http-equiv="Content-Script-Type"
                          content="text/javascript">

フォームのボタンがクリックされたときのイベントハンドラを「onclick」といいます。以下のように記述するとイベント処理が実行されます。

onclick="<イベント処理>">

各種イベント

イベントには「ボタンをクリックしたとき」「キーが押されたとき」「マウスが移動したとき」など、いろいろな種類があります。 ここでは具体的な使用例をまとめていきます。

もっと知識を広げるための参考

戻る

スポンサーリンク

サイト内のページ

言語
C・C++ /HTML /Java /JavaScript /PHP /シェルスクリプト

開発環境
Ant /Bcc /Eclipse /gcc /gdb /g++ /JDK /JUnit /ZAP

技術・仕様
Ajax /CORBA /Java EE(旧称J2EE) /JNI

ライブラリ/Framework/CMS
jQuery /Lucene /MyBatis /RESTEasy /Spring /Struts /Seasar2 /WordPress

ITインフラ OSとミドルウェア
Linux /Windows /シェル
Apache/Tomcat /MySQL /Redis /Solr /vsftpd

ITインフラ PC 製品
ZOTAC

ITインフラ サーバー
Web公開サーバー構築

ITインフラ ネットワーク
プログラミング /機器 /構築

ITインフラ セキュリティ
公開サーバーのセキュリティ

SI
ホームページの作り方 /小さな会社のISMS

その他
IT用語 /ITスキル体系 /トレンド履歴 /翻訳英語の学習 /RSEUserGuide翻訳

スポンサーリンク