苗景云的博客

JSON文件内容格式

[
{"title":"aaaaaaaaa","content":"bbbbbbbbbbbbbbbbbb","page":"1"},
{"title":"ccccccccc","content":"dddddddddddddddddd","page":"2"},
{"title":"eeeeeeeee","content":"ffffffffffffffffff","page":"3"}
]

JS代码：

$(function () {
  //点击显示更多
  var i = 1; //初始页数为1
  $('.more').click(function () {
    $('.p_2').show();
    setTimeout(function () {
      $.getJSON("json文件路径", function (data) {
        //过滤
        data = $.grep(data, function (item) {
          return item.page == i;
        });
        if (data && data != '') {
          //循环
          $.each(data, function (index, array) {
            var content = "<ul><li class='li_1'><a href='#'><img src='' alt=''></a></li><li class='li_2'><h2>" + array['title'] + "</h2><p>" + array['content'] + "</p></li></ul>";
            $('.content').append(content);
          });
          i++;
        } else {
          $('.more a').html("没有更多了");
        }
        $('.p_2').hide();
      });
    }, 1000);
  });
});