页面向下滚动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 相关文章推荐
javascript appendChild,innerHTML,join性能比较代码
Aug 29 Javascript
读jQuery之五(取DOM元素)
Jun 20 Javascript
jQuery判断checkbox(复选框)是否被选中以及全选、反选实现代码
Feb 21 Javascript
jQuery地图map悬停显示省市代码分享
Aug 20 Javascript
理解javascript正则表达式
Mar 08 Javascript
JavaScript 继承详解(六)
Oct 11 Javascript
JavaScript和jQuery获取input框的绝对位置实现方法
Oct 13 Javascript
jQuery实现简单的下拉菜单导航功能示例
Dec 07 jQuery
jquery radio 动态控制选中失效问题的解决方法
Feb 28 jQuery
vue 自定义全局方法,在组件里面的使用介绍
Feb 28 Javascript
Vue 实现手动刷新组件的方法
Feb 19 Javascript
全网小程序接口请求封装实例代码
Nov 06 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
全国FM电台频率大全 - 20 广西省
2020/03/11 无线电
PHP SPL使用方法和他的威力
2013/11/12 PHP
ThinkPHP实现递归无级分类――代码少
2015/07/29 PHP
PHP实现会员账号单唯一登录的方法分析
2019/03/07 PHP
Thinkphp 框架扩展之行为扩展原理与实现方法分析
2020/04/23 PHP
JQuery Ajax通过Handler访问外部XML数据的代码
2010/06/01 Javascript
jQuery中绑定事件的命名空间详解
2011/04/05 Javascript
怎样在JavaScript里写一个swing把数据插入数据库
2012/12/10 Javascript
对frameset、frame、iframe的js操作示例代码
2013/08/16 Javascript
jquery插件开发之实现google+圈子选择功能
2014/03/10 Javascript
javascript中var的重要性分析
2015/02/11 Javascript
jquery实现简易的移动端验证表单
2015/11/08 Javascript
辨析JavaScript中的Undefined类型与null类型
2016/05/26 Javascript
微信小程序 简单DEMO布局,逻辑,样式的练习
2016/11/30 Javascript
一句jQuery代码实现返回顶部效果(简单实用)
2016/12/28 Javascript
JS表单验证方法实例小结【电话、身份证号、Email、中文、特殊字符、身份证号等】
2017/02/14 Javascript
ES6新特性四:变量的解构赋值实例
2017/04/21 Javascript
Vue2 配置 Axios api 接口调用文件的方法
2017/11/13 Javascript
详解webpack + react + react-router 如何实现懒加载
2017/11/20 Javascript
JavaScript根据json生成html表格的示例代码
2018/10/24 Javascript
微信小程序 网络通信实现详解
2019/07/23 Javascript
Angular8 实现table表格表头固定效果
2020/01/03 Javascript
python编程通过蒙特卡洛法计算定积分详解
2017/12/13 Python
Pycharm如何自动生成头文件注释
2020/11/14 Python
快速解决pymongo操作mongodb的时区问题
2020/12/05 Python
python 如何把docker-compose.yaml导入到数据库相关条目里
2021/01/15 Python
css和css3弹性盒模型实现元素宽度(高度)自适应
2019/05/15 HTML / CSS
美国婚礼装饰和活动用品批发供应商:Event Decor Direct
2018/10/12 全球购物
NYX Professional Makeup官方网站:专业彩妆和美容产品
2019/10/29 全球购物
俄罗斯金苹果网上化妆品和香水商店:Goldapple
2019/12/01 全球购物
中级会计职业生涯规划书
2014/03/01 职场文书
2014年教育教学工作总结
2014/11/13 职场文书
2014年小学校长工作总结
2014/12/08 职场文书
股东大会通知
2015/04/24 职场文书
《最后一头战象》教学反思
2016/02/16 职场文书
2016年世界艾滋病日宣传活动总结
2016/04/01 职场文书