页面向下滚动ajax获取数据的实现方法(兼容手机)


Posted in Javascript onMay 24, 2016

页面向下滚动ajax获取数据的实现方法(兼容手机)

$(window).scroll(function () {
      var scrollTop = $(this).scrollTop();
      var scrollHeight = $(document).height();
      var windowHeight = $(this).height();


      if (scrollTop + windowHeight >= scrollHeight) {
        loadPromotions();
      }

    });

   var page = 1;
   var morAvaliable = true;//标识还有数据可以加载
   function loadPromotions() {
    if (morAvaliable) {
      var href = location.href.split('?')[0];
      var pageSize = 5;
      page++;
      $.post(href,
        {
          pageNo: page,
          pageSize: pageSize
        }
        , function (data) {
          if (data.length) {
            var html = '';
            $.each(data, function (i, list) {
              html += '<div class="task-time">' + list.CreateTime + '</div>';
              html += '<a class="task-box" href="' + list.Url + '">';
              html += '<h5>' + list.Title + '</h5>';
            });
            $('#promotionList').append(html);
          }
          else {
            morAvaliable = false;
            $('#loading').html('没有更多分享信息了');
          }
        }
      );
    }
  }

以上这篇页面向下滚动ajax获取数据的实现方法(兼容手机)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ExtJS 2.0实用简明教程 之获得ExtJS
Apr 29 Javascript
javascript动画对象支持加速、减速、缓入、缓出的实现代码
Sep 30 Javascript
js获取控件位置以及不同浏览器中的差别介绍
Aug 08 Javascript
JavaScript整除运算函数ceil和floor的区别分析
Apr 14 Javascript
js精准的倒计时函数分享
Jun 29 Javascript
基于JS实现横线提示输入验证码随验证码输入消失(js验证码的实现)
Oct 27 Javascript
利用Plupload.js解决大文件上传问题, 带进度条和背景遮罩层
Mar 15 Javascript
Vue中保存用户登录状态实例代码
Jun 07 Javascript
让div运动起来 js实现缓动效果
Jul 06 Javascript
vue实现留言板todolist功能
Aug 16 Javascript
vue项目中使用eslint+prettier规范与检查代码的方法
Jan 16 Javascript
JavaScript常用工具函数汇总(浏览器环境)
Sep 17 Javascript
JQuery点击事件回到页面顶部效果的实现代码
May 24 #Javascript
JavaScript中判断数据类型的方法总结
May 24 #Javascript
JS实现回到页面顶部动画效果的简单实例
May 24 #Javascript
jQuery中借助deferred来请求及判断AJAX加载的实例讲解
May 24 #Javascript
JS 清除字符串数组中,重复元素的实现方法
May 24 #Javascript
原生js的数组除重复简单实例
May 24 #Javascript
实例讲解jQuery中对事件的命名空间的运用
May 24 #Javascript
You might like
第一个无线电台是由谁发明的
2021/03/01 无线电
php中XMLHttpRequest(Ajax)不能设置自定义的Referer的解决方法
2011/11/26 PHP
php从字符串创建函数的方法
2015/03/16 PHP
PHP获取毫秒级时间戳的方法
2015/04/15 PHP
Smarty最简单实现列表奇偶变色的方法
2015/07/01 PHP
CI框架实现框架前后端分离的方法详解
2016/12/30 PHP
laravel实现查询最后执行的一条sql语句的方法
2019/10/09 PHP
让whoops帮我们告别ThinkPHP6的异常页面
2020/03/02 PHP
漂亮的提示信息(带箭头)
2007/03/21 Javascript
javascript自定义startWith()和endWith()的两种方法
2013/11/11 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
2014/04/20 Javascript
angularjs在ng-repeat中使用ng-model遇到的问题
2016/01/21 Javascript
JavaScript基本类型值-Number类型
2017/02/24 Javascript
angularjs实现天气预报功能
2020/06/16 Javascript
vue渲染时闪烁{{}}的问题及解决方法
2018/03/28 Javascript
微信小程序实现单个卡片左滑显示按钮并防止上下滑动干扰功能
2019/12/06 Javascript
vue实现拖拽效果
2019/12/23 Javascript
基于ajax及jQuery实现局部刷新过程解析
2020/09/12 jQuery
vue-路由精讲 二级路由和三级路由的作用
2020/08/06 Javascript
Python实现根据指定端口探测服务器/模块部署的方法
2014/08/25 Python
Python生成密码库功能示例
2017/05/23 Python
python安装Scrapy图文教程
2017/08/14 Python
python 3.6.4 安装配置方法图文教程
2018/09/18 Python
Python第三方库h5py_读取mat文件并显示值的方法
2019/02/08 Python
解决Python3下map函数的显示问题
2019/12/04 Python
python接口自动化如何封装获取常量的类
2019/12/24 Python
sklearn+python:线性回归案例
2020/02/24 Python
canvas拼图功能实现代码示例
2018/11/21 HTML / CSS
Omio西班牙:全欧洲低价大巴、火车和航班搜索和比价
2017/02/11 全球购物
高分子材料与工程专业个人求职信
2013/12/15 职场文书
九月份红领巾广播稿
2014/01/22 职场文书
保险经纪人求职信
2014/03/11 职场文书
大学生村官承诺书
2014/03/28 职场文书
Java集成swagger文档组件
2021/06/28 Java/Android
python数字类型和占位符详情
2022/03/13 Python
Python OpenCV超详细讲解基本功能
2022/04/02 Python