Question

// ajax加载更多

$(document).on( 'click', '.loadmorebutton', function() {
 $(this).parent().find(".loadmore").show();  
  $.ajax({
    type: "post",
    url: "something.php",
    data: variable,
    dataType: "text",                  
    success: function(data) { 
        $items = $(data); 
        $grid.append( $items )
        .masonry( 'appended', $items );
        $(this).parent().find(".loadmore").hide();   
    }.bind(this)
  });
});

以上ajax代码用于从something.php文件中获取数据，然后将结果附加到砌体布局。

// ajax获取完整内容

$(document).on( 'click', '.loadmorecontent', function() {
      $(this).parent().find(".loadingdata").show();
      $.ajax({
          type: "post",
          url: someother.php,
          data: morevariable,
          dataType: "text",                  
          success: function(response) {
            $(this).parent().find(".loadingdata").hide();
          }.bind(this)
      });

现在这里ajax应该在每次点击loadmorecontent时被调用，并且应该显示loadingdata gif，直到成功它对最初出现的div工作正常，但是后来由loadmorebuttoon click点击后创建的附加div。

我如何能够为每个div发生这种情况，无论是最初出现还是之后追加

Answer 1

在所有情况下，无论何时您需要在第一时间执行某些操作（如点击事件或任何其他操作），甚至在新div添加后，只需创建该click事件的功能并在需要时调用该函数。

它也适用于新追加的div。

Answer 2

这就发生了，因为您的代码刚刚将事件绑定到页面中的元素。因此，当将事件添加到页面时，您必须将事件绑定到新元素。

在ajax调用加载更多加载gif仅适用于最初存在的div

2 个答案: