jquery .each() 循环继续加载更多按钮？答案

【问题标题】：jquery .each() loop continue on load more button?jquery .each() 循环继续加载更多按钮？
【发布时间】：2015-08-10 23:46:39
【问题描述】：

我已经为我的数组创建了 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>

【问题讨论】：

不清楚你得到了什么结果或你在问什么。

标签： jquery each slice

【解决方案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。

【讨论】：