jQuery イベント

※詳細はhtmlイベント一覧参照

イベントをキャッチ

<input type="button" id="btnTest" value="aaa" />
$(function(){
　　$('#btnTest').on('click' , function(){
　　　　～
　　});
});
以下の様な書き方も可
$(function(){
　　$('#btnTest').click(function(){
　　　　～
　　});
});

$(function(){
　　$('#btnTest').on('click' , (セレクタ) , function(){
　　$('#btnTest').on('click' , 'input:not(.allow_submit)' , function(){
　　　　～
　　});
});
“input:not(.allow_submit)”
サブルーチン呼び出し
function subRoutine(){
　　window.alert('OK');
}
$(function(){
　　$('#btnTest').click(function(){
　　　　subRoutine();
　　});
　　または
　　$('#btnTest').click(subRoutine);
　　$('#btnTest').on('click',subRoutine);
});

イベントを発生させる

<input type="button" id="btnTest" value="aaa" />
先にイベントを書いておく
$(function(){
　　$('#btnTest').trigger('click');
});

イベントのキャンセル

$(document).on("keypress", function (event) {
　　イベント(この場合、全キー押下)をキャンセル
　　event.preventDefault();
　　
　　Enterキー押下をキャンセル
　　return event.which !== 13;
　}
});

特定の操作をキャンセル
$(document).on("keypress", function (event) {
　Enterキー押下時
　if (event.keyCode == 13) {
　　イベント(この場合Enterキー押下)をキャンセル
　　event.preventDefault();
　}
});

イベントの種類

click / dblclick
mouseout / mouseover / mousedown / mouseup / hover
mousemove
keypress / keydown / keyup
change
select
submit
focus/ blur
contextmenu
※詳細はhtmlイベント一覧参照

Follow me!