jquery複選框使用JSON創建的點擊功能不起作用

Question

我有一個jquery-ajax函數，它創建了一個複選框列表。

success: function(msg){ 

    jQuery.each(msg.gal_sublocations, function(index, gal_sublocation) { 
     html += '<input type="checkbox" name="data[GalStore][gal_sublocation_id][]" value = "'+gal_sublocation.GalSublocation.id+'" class="chkbx" id="sublocation_'+gal_sublocation.GalSublocation.id+'" />'+gal_sublocation.GalSublocation.name; 

     $('#load_sublocations').html(html); 
     alert(html); 
     $('#sublocation_'+gal_sublocation.GalSublocation.id).click(function(){ 
      alert('Checked !'); 
     }); 

    }); 

} 

的alert(html)產生最終的警覺

<input type="checkbox" name="data[GalStore][gal_sublocation_id][]" value = "99" class="chkbx" id="sublocation_99" />Beltola 
<input type="checkbox" name="data[GalStore][gal_sublocation_id][]" value = "101" class="chkbx" id="sublocation_101" />Dispur 
<input type="checkbox" name="data[GalStore][gal_sublocation_id][]" value = "102" class="chkbx" id="sublocation_102" />Paltan Bazar 
<input type="checkbox" name="data[GalStore][gal_sublocation_id][]" value = "100" class="chkbx" id="sublocation_100" />Patarkuchi 

但是當我點擊複選框，它沒有任何警告！怎麼了 ？

Answer 1

您需要使用jquery On（），因爲您的代碼在加載後附加。

這樣使用;

$(".class").on('click', function(){ 
// ajax operation 
}} 

Answer 2

在創建您的輸入字符串，最好創建一個節點就在那裏：

var html = $("<input />").attr({ 
    "type" : "checkbox", 
    "name" : data[GalStore][gal_sublocation_id][], 
    "id" : 'sublocation_' + gal_sublocation.GalSublocation.id, 
    "class" : "chkbx" 
}) 
.val(gal_sublocation.GalSublocation.id) 
.click(function(){ 
     alert('Checked !'); 
}); 

$('#load_sublocations').append(html);