JQuery - ドロップダウンへの変更イベントの追加

Question

ドロップダウンのHTMLが変更される可能性があり、.changeオプションではなく.liveオプションを使用して設定しようとしていました。それは私にとってはうまくいかない。

私が現在持っていることは次のとおりです。Unfortuantely

$("#ItemsPerPage").change(function(e) { return updatePaging(); }); 

、私は$.ajaxを経由して、このコントロールを更新した場合、それはイベント定義を失います。私が試したもので、動作していないものは次のとおりです。

$("#ItemsPerPage").live("change", function(e) { return updatePaging(); }); 

Answer 1

毎回<select>を再バインドする代わりに、その内容（<option>要素のリスト）をスワップするほうがよいでしょう。

$("#ItemsPerPage").change(function(e) { return updatePaging(); }); 

をしかし、あなたはそれを更新するとき、ちょうど（newSelectElementが新しい<select>要素である）、その内容にスワップアウト：

function updateItemsPerPage(newSelectElement) { 
    $("#ItemsPerPage").empty().append(newSelectElement.childNodes); 
} 

この方法は、あなたがすでにあるよう

だからこれを使用しますノード自体がスワップされないため、バインドはリフレッシュする必要はありません。

Answer 2

changeイベントはlive（）ではサポートされていません。イベント定義を再割り当てするすべてのAJAX呼び出しの最後に関数を実行するのはどうですか？

Answer 3

samizの提案について詳しく説明するには、このような何かをする必要があります：

$(function() { 
    bind_items_per_page(); 
}); 

function bind_items_per_page() { 
    $("#ItemsPerPage").unbind('change').bind('change',function() { 
     updatePaging(); 
    }); 
} 

function updatePaging() { 
    $.post('/some/script',{foo:'bar',bar:'foo'},function(data) { 
     /* what ever you need to do */ 
     // And assuming what ever you did above changed your select box... 
     bind_items_per_page(); 
    }); 
}