jQueryのイベント設定と種類
jQueryのイベントと実行する関数の設定
基本的には以下の構文で、あるイベントが発生したらfunction内の処理を実行する、という処理を書く。
$(function() {
$("セレクタ").on("イベント", function() {
イベントが起きた時の処理
});
});
例えば、idがsection1のタグがクリックされたら、
console.log("クリックされた"); を実行する場合、下記のように書く。
$(function(){
$("section1").on("click", function(){
console.log("クリックされた");
});
});
jQueryのイベントの種類
jQueryのイベントはclick以外にもたくさんある。
- click (クリックされた時)
- dbclick (ダブルクリックされた時)
- focus (要素がフォーカスされた時)
- blur (要素がフォーカスを失った時)
- load (ドキュメント内のリソースが読み込み終わった時)
- resize (windowの大きさが変更された時)
- scroll (ドキュメントがスクロールした時)
- mousedown (要素上でマウスが押された時)
- mouseup (要素上でマウスが押され、上がった時)
- select (type属性値が”text”のinput要素、textarea要素のテキストが選択された時)
- change (要素がフォーカスを得て値の修正が完了した時)
- submit (フォームが送信された時)
- keydown (キータ押し下げられた時)
- keypress (キーが押された時)
- keyup (キーが上がった時)