jQuery on と off によるイベント登録と登録解除

jQuery でイベントを登録する方法です。バージョンに応じて様々な方法がありますが、
ここでは on と off を使ってイベントを登録する実装例を紹介します。

// DOM 上のすべてのラジオボタンの変更イベントを登録
$('input:radio').on('change',function () {
        alert('どこかのチェックが変更されました。');
    }
);
// name 属性が group1 のラジオボタンの変更イベントを登録
$('input[name="group1"]:radio').on('change', function ()
{
    alert('group1 でチェックが変更されました。');
});


<input id="Radio1" name="group1" type="radio" />
<input id="Radio2" name="group1" type="radio" checked="checked" />
<input id="Radio3" name="group1" type="radio" />

<input id="Radio4" name="group2" type="radio" />
<input id="Radio5" name="group2" type="radio" checked="checked" />
<input id="Radio6" name="group2" type="radio" />


また、イベントの登録解除は off を使います。

// イベントの登録解除
$('input[name="group1"]:radio').off('change');

jQuery の on と off はそれぞれバージョン 1.7 から導入されました。これより古いバージョンであれば、delegate など他のイベント登録方法を利用します。

コメント

このブログの人気の投稿

PHP クリックされたボタンに応じて処理を実行する

JavaScript Date(日付) データを yyyy/MM/dd 形式にフォーマットする

jQuery ページ初期表示時に処理を実行