欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

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

程序员文章站 2022-03-30 15:51:55
...
随着互联网时代的发展,web前端已经和后台数据挂钩,作为web前端仅仅不是只切图写写html,css 和简单js交互。

js code

$(function() {
  var page = 1;
  var discount = $('#discount');
  var innerHeight = window.innerHeight;
  var timer2 = null;
  $.ajax({
    url: '/lightapp/marketing/verify/apply/list?page=1',
    type: 'GET',
    dataType: 'json',
    timeout: '1000',
    cache: 'false',
    success: function (data) {
        if (data.error_code === 0) {
          var arrText = [];
          for (var i = 0, t; t = data.list[i++];) {
            arrText.push('
'); arrText.push('

' + 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 jQuery+AJAX实现无刷新下拉加载更多_jquery
'); $('html,body').scrollTop($(window).height() + $(document).height()); page++; $.ajax({ url: '/lightapp/marketing/verify/apply/list?page=' + page, type: 'GET', dataType: 'json', success: function (data) { if (data.error_code === 0) { var arrText = []; for (var i = 0, t; t = data.list[i++];) { 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'); }) })