динамически загружен флажок не стреляя

Question

Таблица загрузки с помощью AJAX сильфон ..

$.ajax({ 

     type:"POST", 
     url:"loadquestionsajax.php", 
     data:"qcategory="+qcategory, 
     dataType:"json", 
     success: function(s){ 


      $.each(s,function(i,obj) 
      { 
       if(obj!=false){ 

      while(i<1){ 
       $("#t01").append("<tr>"+"<th><input type='checkbox' class='cbox' value=''/></th>"+"<th>Question ID</th>"+"<th>Question</th>"+"<th>Choice 1</th>"+"<th>Choice 2</th>"+"<th>Choice 3</th>"+"<th>Choice 4</th>"+"<th>Answer</th>"+"</tr>"); 

      i++; 
      } 



      $("#t01").append("<tr>"+"<td><input type='checkbox' name='qtns[]' class='cbox' value='"+obj[0]+"'/></td>"+"<td>"+obj[0]+"</td>"+"<td>"+obj[1]+"</td>"+"<td>"+obj[2]+"</td>"+"<td>"+obj[3]+"</td>"+"<td>"+obj[4]+"</td>"+"<td>"+obj[5]+"</td>"+"<td>"+obj[6]+"</td>"+"</tr>"); 


      }else{ 
       exit(); 
      } 
      }); 


     } 


    }); 

и мой обработчик событий код ниже. (он не звонит даже с проверкой флажка.) Пожалуйста, помогите мне. Заранее спасибо.

$ (документ) .ready (функция() {

$(document).on('click', '.cbox', function(){ 
     alert('test'); 
    }); 

    }); 

и я сильфона код также.

$ (документ) .ready (функция() {

$('.cbox').change(function(){ // .click also seen but not workig. 

     alert("hello")       
     ;   

    }); 

    }); 

Answer 1

Проблема, с которой вы сталкиваетесь, заключается в том, что при определении функций щелчка/изменения в вашем javascript вы выполняете их в рамках функции готовности документа. Это означает, что он свяжет эти прослушиватели событий только с элементами, которые присутствуют при загрузке документа. Если вы хотите добавить элементы функциональности изменения в DOM после ajax, вам придется динамически связывать эти прослушиватели событий.

Простейшим способом было бы повторно запустить существующий код, как только все элементы будут добавлены в DOM.

success: function(s){ 

     //... 
     // elements created 
     //... 

    //now reload the event listener 
     $(document).on('click', '.cbox', function(){ 
      alert('test'); 
     }); 


    } 

Answer 2

Флажки _newly_added_ не будут реализовывать поведение «.cbox». Потому что вы определяете такое поведение с помощью jquery по $(document).ready(..), а после добавления нового флажка, который ничего не знает о вашем $(document).ready(..) событий, даже у него будет .cbox класс. Добавьте обработчик $('#newElementId').change(function(){..}) вручную для каждого нового элемента.