0

phonegap と javascript の使用

動的に作成された UL リストがあり、2 つのチェックボックスがあります。LI 項目を手動で追加すると、クリック機能が正常に機能します。

しかし、li アイテムを動的に追加すると、クリック機能が起動しません。

//This is the code that I use to populate the UL list

if (records[r_key].name.indexOf("#") == -1) {
    $('#ItemSelection').append('<li><p class="name">' + records[r_key].name +'</p><input type="checkbox" id="w' + records[r_key].id +'" class="markedplayer"><input type="checkbox" id="s' + records[r_key].id + '" class="markedwinner"></li>');
}

//This is the code to do something when any box is checked
$(":checkbox").click(function() {
    if (this.checked){
    //do something
    } else {
        //something else if not checked    
    } 
});
4

3 に答える 3

2

変更しonてデリゲート イベントを作成します。

$("#ContainerID}").on('click', ':checkbox', function(){

静的な親のIDはどこContainerIDにありますか（チェックボックスにできるだけ近い方がよい）

あなたの場合、コンテナは#ItemSelection

デリゲート イベントには、動的に挿入された要素でも発生するという利点があります。

于 2013-03-18T19:52:25.027 に答える
0

新品でもカチッと付け直す必要があるので。クリック イベントは、魔法のように新しいものが追加されたことを認識しません。

ul でクリック イベントをリッスンすれば、イベントの再アタッチについて心配する必要はありません。

$("#ItemSelection").on("click", "input[type='checkbox']", function(){
    if (this.checked){
        //do something
    } else {
        //something else if not checked    
    } 
});
于 2013-03-18T19:52:42.717 に答える
0

そのセレクターは、DOM がロードされたときに 1 回だけ起動します。DOM に追加された各要素で機能するには、次のonメソッドを使用する必要があります。

$(container).on('click', ':checkbox', function(){
    if (this.checked){
      //do something
    } else {
      //something else if not checked    
    }
});
于 2013-03-18T19:52:44.283 に答える