Question

问题：从包含要在jQuery调用中使用的组件的Ajax请求中检索数据时。 jQuery没有工作。

解决方案：正如Bikash Waiba所回答的，发生这种情况的原因是因为jQuery功能需要知道页面已加载。

Answer 1

您可以将其变为函数，并使用onclick=""属性来调用该函数。

<script>
function request(id) {
    $.ajax({
      url: '../resources/handlers/like.php',
      type: 'POST',
      data: {id: id},
      cache:false,
      success: function(data) {
        $('#likeNumber').html(data);
      }
    });
}
</script>
<div class='community-post-like-button' id='likeClick' data-value='test' onclick="request(this.id);">Like Me</div>

Answer 2

从php函数回显html绝对没问题，如果你在页面加载后通过ajax动态回显块，在这种情况下你可以做这样的事情

$(document).on("click",'#likeClick',function(e){
     var id = $('#likeClick').data('value');
   $.ajax({
     url: '../resources/handlers/like.php',
     type: 'POST',
     data: {id: id},
     cache:false,
     success: function(data) {
       $('#likeNumber').html(data);
     }
   });
});

Answer 3

如果有多行，则必须使用class属性而不是idlike属性用于#likeClick，使用类.community-post-like-button id不应在同一HTML文档中重复。那么你的代码就像这样。

HTML

<div class='community-post-like-button' id='likeClick' data-value='{$id}'>Like Me</div>

的JavaScript

 $(document).ready(function() {
      $('.community-post-like-button').click(function(){
         var id = $(this).data('value');
         $.ajax({
         url: '../resources/handlers/like.php',
         type: 'POST',
         data: {id: id},
         cache:false,
          success: function(data) {
            $('#likeNumber').html(data);
          }
        });
       });
   });

触发通过AJAX加载的事件

3 个答案: