html下拉加载更多jq,jQuery+AJAX实现无刷新下拉加载更多

jQuery+AJAX实现无刷新下拉加载更多

2018-12-31

编程之家

https://www.jb51.cc

编程之家收集整理的这篇文章主要介绍了jQuery+AJAX实现无刷新下拉加载更多，编程之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

随着互联网时代的发展，web前端已经和后台数据挂钩，作为web前端仅仅不是只切图写写html，css 和简单js交互。

js code

' + t.title + '');

if (t.coupon_type == 1 ) {

arrText.push('

金额：￥' + t.amount + '');

} else {

arrText.push('

优惠：' + t.amount + '');

}

arrText.push('

用户：s账户飒飒是是是啊啊12' + t.user_name +'' + '核销时间：' + t.use_time + '');

arrText.push('');

}

discount.html(arrText.join(''));

};

var ajax_getting = false;

$(window).scroll(function() {

clearTimeout(timer2);

timer2 = setTimeout(function() {

var scrollTop = $(document.body).scrollTop();

var scrollHeight = $('body').height();

var windowHeight = innerHeight;

var scrollWhole = Math.max(scrollHeight - scrollTop - windowHeight);

if (scrollWhole < 100) {

if (ajax_getting) {

return false;

} else {

ajax_getting = true;

}

discount.append('');

$('html,body').scrollTop($(window).height() + $(document).height());

page++;

$.ajax({

url: '/lightapp/marketing/verify/apply/list?page=' + page,success: function (data) {

if (data.error_code === 0) {

var arrText = [];

for (var i = 0,t; t = data.list[i++];) {

arrText.push('

' + t.title + '');

if (t.coupon_type == 1 ) {

arrText.push('

金额：￥' + t.amount + '');

} else {

arrText.push('

优惠：' + t.amount + '');

};

arrText.push('

' + '核销时间：' + t.use_time + '');

arrText.push('');

}

discount.append(arrText.join(''));

$(".load").remove();

} else {

$(".load").remove();

discount.append('

');

$(window).unbind('scroll');

};

ajax_getting = false;

}

});

};

$(".load").remove();

},200);

});

if (data.error_code == 156006) {

$('.coupon').html('

出错啦！

原因：未登录')

};

if (data.error_code == 156003) {

$('.coupon').html('

出错啦！

原因：权限不足~请补充')

};

if (data.error_code == 156007) {

$('.coupon').html('

出错啦！

原因：服务异常')

};

if (data.error_code == 511) {

$('.coupon').html('

出错啦！

原因：账号未开通直达号')

};

if (data.error_code == 520) {

$('.coupon').html('

暂无核销记录')

}

},error: function (data) {

}

})

$(window).bind("orientationchange",function() {

$('.sliders').css('left',$(window).width() / 2 +'px');

})

})

以上所述就是本文的全部内容了，希望大家能够喜欢。

总结

如果觉得编程之家网站内容还不错，欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。

小编个人微信号 jb51ccc

喜欢与人分享编程技术与工作经验，欢迎加入编程之家官方交流群！