图片懒加载

图片懒加载

例子中用的url是jsonplaceholder

现在有很多的懒加载插件，这个例子只是随便写写

在拖动滚动条的时候，当前的图片已经展示完，就会触发下一个图片请求接口

代码：
var index=0;
$(()=>{
// 初始化加载
imgList(index)

// 滚动轴
KaTeX parse error: Expected '}', got 'EOF' at end of input: …op = Math.ceil((this).scrollTop())//滚动轴距离上方的高度
var _h = $(this).height()//可是区域的高度
var h = $(document).height()//整个文档的高度
if(scrollTop+_h >= h){
index = 10+index
imgList(index)
}
})
})
function imgList(index){
$.ajax({
type:‘get’,
url:‘http://jsonplaceholder.typicode.com/photos’,
dataType:‘json’,
success:function(data){
// console.log(data);
// data.forEach(element => {
// $(‘ul’).append(// <li><img src="https://via.placeholder.com/600/24f355" alt=""></li> //)
// });

        for(var i=index;i<index+10;i++){
            $('ul').append(`
            <li id=${i}><img src=${data[i].url} alt=""></li>
            `)
        }
        
    },
    error:function(){}
})

}