求教一下大家，加载图片时只加载有限张，点击加载更多再加载其他图片是怎么做到的？

Question

比如有二十张图片，一开始显示出来五张，最下方显示加载更多按钮。点一下加载更多，就在原来基础上再显示五张图片。这是怎么弄得呀，希望大家可以告诉我一下。谢谢。

Answer 1

动态加载：需要用到的前端技术有ajax，jQuery(js)

具体实现，

首先从数据库加载相关的20张图片路径，然后放到标签中显示（可以通过分页的方式）

其次就是记载更多了，页面无刷新，通过jQuery，为按钮追加点击事件，触发ajax操作，

//可以是这样 
$.ajax({
    请求路径

    method:"post",//请求方式

    data:{"times":times,"count":count},//请求参数
    dataType:"json",//返回数据类型
    success:function(data) {
        //通过jQuery追加数据到末尾就行了
    }
})

data:{"times":times,"count":count}解析：times为第几次获取数据，count为要获取的数量

到数据库就是这样的查询select * from _picture limit (20+(times-1)*count), count，（mysql中），只写了关键的语句，把返回的数据通过jQuery操作就行了，如果不行的话，再问我！

Answer 2

var dataInt_0={'data':[{'src':'1.jpg'},{'src':'2.jpg'},{'src':'3.jpg'},{'src':'4.jpg'},{'src':'5.jpg'}]}; 
var dataInt_1 = ...
$('body').on('click','body',function(){
    $.each(dataInt.data, function(index, value){
        $('<img>').attr('src','./images/' + $( value).attr( 'src') ).appendTo($(body));
    });
});