onClick对ajax生成的内容不起作用


onClick not working on ajax generated content

我的代码没有显示错误,但也不能正常工作。ajax调用的输出工作正常,但我只是无法从onClick中得到任何东西,没有错误消息,什么也没有。

HTML

<div id="serials"></div>
<div id="accounts_info_key" style="text-align:left"></div>

Ajax调用

$(document).ready(function() { 
$('.tab2').click(function(){
        var account_id = $('#account_id').val();
              $.ajax({
                 url: 'ajax/account_info_serials_ajax.php',
                 type:'POST',
                 dataType: 'json',
                 data: 'account_id='+account_id,
                        success: function(response){
                $('#serials').html(response.table),
                $('#accounts_info_key').html(response.key),
                $('.drop_down').hide();
                },
              error:function (xhr, ajaxOptions, thrownError){
              alert(thrownError);
               } // End of success function of ajax form
              }); //end of ajax
       });//close trigger
  });//close whole function

PHP

   $response = '';
   $response .='<div class="question">';
   $response .='plop';
   $response .='</div>';
   $response .='<div class="drop_down">';
   $response .='bob';
   $response .='</div>';
   $output_array = array(
              'table' => $response,
              'key' => $key,
              'count' => $count 
    );
  echo json_encode($output_array);
jquery onclick
$(document).ready(function() {  
    $('#serials').on("click", ".question", function(e){
        alert('smeg');  
    });
});

请注意,我不是在问怎么做,我是在问为什么我的版本不工作,这不是一个重复的问题

我已经创建了一个小提琴,显示了如何在我看来应该做http://jsfiddle.net/6VtA8/。

$(document).ready(function () {
    $('.tab2').click(function () {
        var account_id = $('#account_id').val();
        $.ajax({
            url: '/echo/json/',
            type: 'POST',
            dataType: 'json',
            data: {'something':'else'}
        }).done( function (response) { $('#serials').html('<div class="question ">abcd</div>'); });
    });
}); //close whole function 
$(document).ready(function () {
    $('#serials').on("click", ".question", function (e) {
        alert('smeg');
    });
});

有多种原因可能导致你的代码不能正常工作。它甚至可能是你的div(来自某些css规则)最终会有一个0的高度,因此事件不会触发的事实。因此,我没有进行调试,而是选择进行一些重写。

你必须订阅事件,一旦它在dom中点击#serials。当ajax回调结束。question在dom中时,订阅#serials.