2セレクタ、2つの異なるイベント、同じ機能

Question

私はjQueryの1.7を使用してのように、2個の異なるセレクター上の2つの異なるライブイベントに同じ機能をバインドする必要がありますよ：

function do_something(_this){ 
    // do something with _this 
    alert("test"); 
} 

$("input").live("keyup", function({ 
    do_something($(this)); 
}); 

$("select").live("change", function({ 
    do_something($(this)); 
}); 

これは動作しますが、私は希望何とかこれを何らかのステートメントにまとめることができれば本当に好きです。

// pseudo code 
($("input").live("keyup") || $("select").live("change")).bind(function(){ 
    // do something with $(this) 
    alert("test"); 
}); 

これは可能ですか？

Answer 1

do_something()関数を直接関数.live()に入れて、匿名関数を避けることができます。それはいくつかの文字を節約します。 jQueryの1.7構文に変換するには

$("input").live("keyup", do_something); 
$("select").live("change", do_something); 

、あなたは（.live()があなたのためにやった）デリゲートを使用する必要があります。あなたの入力要素と選択要素がdocumentの場合は、<form>を使用できます。

$(document).on("keyup", "input", do_something); 
$(document).on("change", "select", do_something); 

そして、本当に1回の呼び出しでイベントとセレクタの両方を入れたい場合は、できます。とにかくあなたは同じ関数に行くので、デリゲートを使用しているので合計2つのイベントしかありません。実際に必要と思っている場合は、コールバックのイベントをチェックして、デモに表示されているようにセレクタに一致するイベントを確認することができます。

$(document).on("keyup change", "input, select", do_something); 

デモ：http://jsfiddle.net/ThinkingStiff/6ZUMa/

HTML：

<input /> 
<select> 
    <option>1</option> 
    <option>2</option> 
</select> 

スクリプト：jQueryの1.7のように、.live()方法は推奨されていることを

$(document).on('keyup change', 'input, select', do_something); 

function do_something(event) { 

    //this if() statement probably isn't needed for your purposes 
    if((event.type == 'keyup' && event.target.tagName.toLowerCase() == 'input') 
     || (event.type == 'change' && event.target.tagName.toLowerCase() == 'select')) { 

     //process event here 
     $('input').val(event.type); 

    }; 

}; 

Answer 2

$(".my_selector").live("keyup change", function({ 
    do_something(); 

}）;

これは、クラスにmy_selectrorクラスを追加する場合に有効です。

Answer 3

.liveメソッドは厳重に推奨されていません。 jQueryの1.7のよう http://api.jquery.com/live/

、.live（）メソッドは推奨されています。イベントハンドラを添付するには、.on（）〜 を使用します。古いバージョンのjQueryを使用する場合は、.live（）より優先して .delegate（）を使用する必要があります。フォーカスアウトイベント、任意の入力フィールドや選択項目がフォーカスを失ったとき、あなたが何かを行うことができます（つまり、ユーザと

$("input, select").on("focusout", function(){ 
    alert("focus lost on " + $(this).attr("id")); 
}); 

：.on（）メソッドで

、あなたのようなことを行うことができます現在フォーカスされている別のアイテムに移動しました）。

Answer 4

$('input').on('keyup', do_something); 
$('select').on('change', do_something); 

注意。代わりに.on()を使用してイベントハンドラをアタッチします。古いバージョンのjQueryを使用する場合はを.live()より優先して使用する必要があります。あなたはlive()様機能が必要な場合

、使用：

$(document).on('keyup change', 'input, select', do_something);