Question

我为我的数组制作了每个循环的jQuery，但是我想在第一次启动时加载6个项目，然后当我点击加载更多按钮时，它将显示7到13，依此类推。我首先使用.slice（）完成了6限制，但是在加载更多按钮时总是失败，有人可以帮忙吗？

我的代码：

function loadName(){
  $.getJSON('/namedatabase.php', function(data) {

    $.each($(data).slice(0, 6),function(i,item){
          $(".nameData").append('<div>'+item.name+'</div>');
        });

  });

}

加载更多按钮

<button class="btn btn-primary" onclick="loadName();">Load more</button>

Answer 1

最好实现服务器端分页。

但是如果你想在客户端预加载所有数据，那么试试

function loadName() {
    var $el = $(".nameData"),
        names = $el.data('names'),
        start = $el.data('loadstart');

    if (names) {
        $.getJSON('/namedatabase.php', function (data) {
            $.each(data.slice(0, 6), function (i, item) {
                $el.append('<div>' + item.name + '</div>');
            });
            $el.data({
                names: data,
                start: 6
            });
        });
    } else {
        if (data.length < start) {
            $.each(data.slice(start, start + 6), function (i, item) {
                $el.append('<div>' + item.name + '</div>');
            });
            $el.data('loadstart', start + 6)
        }
    }
}

这是一个有效的fiddle。

jquery .each（）循环继续加载更多按钮？

1 个答案: