推荐一个比较好用的插件dropload.min.js
依赖jquery
demo:
$(function(){
// 页数
var page = 1;
// 每页展示10个
// var size = 10;
var category="<?php echo $category_id; ?>";
$('.stuff_conbox').dropload({
scrollArea : window,
domUp : {
domClass : 'dropload-up',
domRefresh : '<div class="dropload-refresh"></div>',
domUpdate : '<div class="dropload-update"><img src="/statics/img/loading.gif" alt=""></div>',
domLoad : '<div class="dropload-load"><span class="loading"></span></div>'
},
domDown : {
domClass : 'dropload-down',
domRefresh : '<div class="dropload-refresh"></div>',
domLoad : '<div class="dropload-load"></div>',
domNoData : '<div class="dropload-noData"></div>'
},
loadUpFn : function(me){
setTimeout(function(){
// 插入数据到页面,放到最后面
// 每次数据插入,必须重置
window.location.reload();
me.resetload();
},1000);
},
loadDownFn : function(me){
page++;
// 拼接HTML
var str = '';
$.ajax({
type: 'POST',
url: '/api/detailmao',
data:{type:2,pagenum:page},
success: function(data){
if(data){
$(".stuff_conbox").append(data);
// 如果没有数据
}else{
// 锁定
me.lock();
// 无数据
me.noData();
}
// 为了测试,延迟1秒加载
setTimeout(function(){
// 插入数据到页面,放到最后面
$('.stuff_conbox').append(str);
// 每次数据插入,必须重置
me.resetload();
},1000);
},
error: function(xhr, type){
alert('Ajax error!');
// 即使加载出错,也得重置
me.resetload();
}
});
},
threshold : 50
});
});