Question

我试图在没有更多结果显示时停止显示“加载更多”按钮。

所以，我的计划是，一旦点击加载更多按钮并且查询在数据库上运行，我会做一个rowcount，然后如果该数字小于LIMIT claus中请求的数量，那么我将返回该信息

所以目前我的js脚本看起来像这样：

$(document).ready(function(){
    var pageIndex = 1;
    $('#loadmorebuilds-div').click(function() {
        $('#buildcontainer').imagesLoaded( function(){
        $.ajax({
           url: 'includes/loadmorebuilds.php?type=follow&pageIndex=' + pageIndex,
           success: function(html) {
              var el = jQuery(html);
              jQuery("#buildcontainer").append(el).masonry( 'reload' );
              $("#loadmorebuilds-div").stop();
              pageIndex++;
              $("#buildcontainer").masonry()
           }

        });

    });

});
});

这很好用，但我想在loadmorebuilds.php页面中放一个JSON返回。

所以计划就是这样做。

// check if the results count is less than requested
if ($checkforlast < 8) {
    $return['noMore'] = true;
    echo json_encode($return);
}

然后我会改变我的js看起来像这样：

$(document).ready(function(){
    var pageIndex = 1;
    $('#loadmorebuilds-div').click(function() {
        $('#buildcontainer').imagesLoaded( function(){
        $.ajax({
           url: 'includes/loadmorebuilds.php?type=follow&pageIndex=' + pageIndex,
           success: function(html) {
              var el = jQuery(html);
              jQuery("#buildcontainer").append(el).masonry( 'reload' );
              $("#loadmorebuilds-div").stop().fadeOut();
              pageIndex++;
              $("#buildcontainer").masonry()

              if (response.correctKey === true) {
                DO SOMETHING TO REMOVE BUTTON
              }

           }

        });

    });

});
});

当我更改内容类型时出现问题：

header('Content-Type: application/json');

因为那会改变我发回的数据的方式（我认为？）。更改内容类型会导致没有显示新内容，并且在单击加载更多按钮时没有任何操作。

是否有另一种方法可以将数据包发送到ajax调用，如果结果少于请求而不更改内容类型？

希望这是有道理的！

Answer 1

如果您正在返回JSON，那么您不能指望像以前那样简单地将JSON附加到DOM。考虑一下你的成功处理程序：

success: function(html) {
  var el = jQuery(html);
  jQuery("#buildcontainer").append(el).masonry( 'reload' );
  $("#loadmorebuilds-div").stop().fadeOut();
  pageIndex++;
  $("#buildcontainer").masonry()

  if (response.correctKey === true) {
    DO SOMETHING TO REMOVE BUTTON
  }

}

将成功处理程序的参数从html更改为json甚至更好data, textStatus, jqXHR。还可以考虑使用jQuery的getJSON()方法作为简写。 http://api.jquery.com/jquery.getjson/

然后，您可以使用data根据需要填充演示文稿，并使用noMore检查data.noMore属性。

Answer 2

我同意@palpatim，字符串解析可能不是最好的方法。但是这个解决方案也可以工作，并且不需要你在客户端上从json构建你的html：

$(document).ready(function(){
  var pageIndex = 1;
  $('#loadmorebuilds-div').click(function() {
    $('#buildcontainer').imagesLoaded( function(){
      $.ajax({
        url: 'includes/loadmorebuilds.php?type=follow&pageIndex=' + pageIndex,
        success: function(html) {
          var el = jQuery(html),
              rowCount = el.find('tr').length;

          jQuery("#buildcontainer").append(el).masonry( 'reload' );
          $("#loadmorebuilds-div").stop().fadeOut();
          pageIndex++;
          $("#buildcontainer").masonry();

          if (rowCount < 8) {
            DO SOMETHING TO REMOVE BUTTON
          }
       }
    });
});
});

我在这里用'tr'来表示你用来保存每个结果的元素。

将内容类型更改为JSON时，从数据库加载更多内容不起作用

2 个答案: