jQuery 点击功能不工作

Question

jQuery 点击功能无法正常使用。实际上它有效，但我在页面加载后通过 JavaScript 调用加载我的 HTML，在这种情况下 jQuery 单击功能不起作用。

HTML 部分：

<table class="table table-lg">
   <thead>
      <tr>
         <th width="5%" class="text-center">#</th>
         <th width="30%" class="text-center"><?php echo lang('suggestion'); ?></th>
         <th width="10%" class="text-center"><?php echo lang('category'); ?></th>
         <th width="15%" class="text-center"><?php echo lang('proposer'); ?></th>
         <th width="14%" class="text-center"><?php echo lang('date'); ?></th>
         <th width="10%" class="text-center"><?php echo lang('likes'); ?></th>
         <th width="16%" class="text-center"><?php echo lang('action'); ?></th>
      </tr>
   </thead>
   <tbody id="get_sgs">

<!-- This part is loading by jQuery POST -->
   </tbody>
</table>

JavaScript:

    <script type="text/javascript">
    window.onload = function() {
        $.ajax({
          url: "<?php echo site_url('get/suggestions'); ?>",
          success: function(data){
            $("#get_sgs").html(data);
          }
        });
    };
    $( "#reload_suggestions" ).click(function() {
        $.ajax({
            url: "<?php echo site_url('get/suggestions'); ?>",
            success: function(data){
                $("#get_sgs").html(data);
            }
        });
    });
    $('.rate_up').click(function() {
   var id = $(this).attr('data-id');
     console.log(id);
   $.ajax({
     url: '<?php echo site_url('rate/up'); ?>' + '/' + id,
     type: 'POST',
     data: {
       'submit': true,
     },

   });
 });
 $('.rate_down').click(function() {
     var id = $(this).attr('data-id');
     console.log(id);
     $.ajax({
         url: '<?php echo site_url('rate/down'); ?>' + '/' + id,
         type: 'POST',
         data: {
             'submit': true,
         },

     });
 });
</script>

提前致谢。

Answer 1

您有两个选择：

在 success 块内的 $("#get_sgs").html(data); 之后直接绑定点击处理程序。
使用 $("#get_sgs").on("click", ".rate_down", function() {

有关第二个选项的说明，请参阅 Event binding on dynamically created elements?。

jQuery 点击功能不工作

jQuery Click Function Not Working

html

javascript

jquery

jquery-click-event