JS简单实现滑动加载数据的方法示例


Posted in Javascript onOctober 18, 2017

本文实例讲述了JS简单实现滑动加载数据的方法。分享给大家供大家参考,具体如下:

//滑动
function getScrollTop()
{
 var scrollTop = 0;
 if (document.documentElement && document.documentElement.scrollTop) {
   scrollTop = document.documentElement.scrollTop;
  }else if (document.body) {
  scrollTop = document.body.scrollTop;
  }
  return scrollTop;
}
//获取当前可视范围的高度
function getClientHeight()
{
 var clientHeight = 0;
 if (document.body.clientHeight && document.documentElement.clientHeight) {
   clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight);
 }else {
   clientHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
 }
   return clientHeight;
}
//获取文档完整的高度
function getScrollHeight()
{
   return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
}
//绑定事件
window.onscroll = function ()
{
 if (getScrollTop() + getClientHeight() == getScrollHeight()) {
  //dosomething
 }
}

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript高级程序设计(第3版)学习笔记6 初识js对象
Oct 11 Javascript
JS中使用sort结合localeCompare实现中文排序实例
Jul 23 Javascript
js实现遮罩层划出效果是生成div而不是显示
Jul 29 Javascript
JS简单循环遍历json数组的方法
Apr 22 Javascript
AngularJS基础 ng-cloak 指令简单示例
Aug 01 Javascript
JS实现图片延迟加载并淡入淡出效果的简单方法
Aug 25 Javascript
值得分享和收藏的xmlplus组件学习教程
May 05 Javascript
微信小程序 刷新上拉下拉不会断详细介绍
May 11 Javascript
鼠标拖动改变DIV等网页元素的大小的实现方法
Jul 06 Javascript
JS简单实现滑动加载数据的方法示例
Oct 18 Javascript
微信小程序表单验证功能完整实例
Dec 01 Javascript
layui--js控制switch的切换方法
Sep 03 Javascript
详解cordova打包成webapp的方法
Oct 18 #Javascript
prototype.js简单实现ajax功能示例
Oct 18 #Javascript
浅谈JS函数节流防抖
Oct 18 #Javascript
用vue封装插件并发布到npm的方法步骤
Oct 18 #Javascript
详解Js中的模块化是如何实现的
Oct 18 #Javascript
JS跳转手机站url的若干注意事项
Oct 18 #Javascript
vue实现手机号码抽奖上下滚动动画示例
Oct 18 #Javascript
You might like
php中通过curl模拟登陆discuz论坛的实现代码
2012/02/16 PHP
浅谈COOKIE和SESSION区别
2015/07/19 PHP
PHP简单判断手机设备的方法
2016/08/23 PHP
laravel创建类似ThinPHP中functions.php的全局函数
2016/11/26 PHP
Javascript结合css实现网页换肤功能
2009/11/02 Javascript
用jquery ajax获取网站Alexa排名的代码
2009/12/12 Javascript
Javascript学习笔记1 数据类型
2010/01/11 Javascript
js下利用控制器载入对应脚本
2010/07/17 Javascript
JavaScript实现找出数组中最长的连续数字序列
2014/09/03 Javascript
JavaScript中的函数嵌套使用
2015/06/04 Javascript
jquery实现拖动效果(代码分享)
2017/01/25 Javascript
用 js 的 selection range 操作选择区域内容和图片
2017/04/18 Javascript
Thinkjs3新手入门之如何使用静态资源目录
2017/12/06 Javascript
vue2.0 根据状态值进行样式的改变展示方法
2018/03/13 Javascript
Angular4 Select选择改变事件的方法
2018/10/09 Javascript
node上的redis调用优化示例详解
2018/10/30 Javascript
JavaScript时间日期操作实例小结【5个示例】
2018/12/22 Javascript
js如何获取访问IP、地区、当前操作浏览器
2019/07/23 Javascript
[01:51]2018年度CS GO最具人气外援-完美盛典
2018/12/16 DOTA
python自动zip压缩目录的方法
2015/06/28 Python
Django1.9 加载通过ImageField上传的图片方法
2018/05/25 Python
python 实现UTC时间加减的方法
2018/12/31 Python
深入理解Django-Signals信号量
2019/02/19 Python
cookies应对python反爬虫知识点详解
2020/11/25 Python
selenium+python自动化78-autoit参数化与批量上传功能的实现
2021/03/04 Python
英国泽西岛植物:Jersey Plants Direct
2019/08/07 全球购物
应届毕业生自我评价分享
2013/12/15 职场文书
珠宝店促销方案
2014/03/21 职场文书
毕业典礼演讲稿
2014/05/13 职场文书
书法大赛策划方案
2014/06/04 职场文书
企业读书活动总结
2014/06/30 职场文书
军人离婚协议书样本
2014/10/21 职场文书
欠条范文
2015/07/03 职场文书
2015年学校综合治理工作总结
2015/07/20 职场文书
导游词之吉林花园山
2019/10/17 职场文书
pytorch 运行一段时间后出现GPU OOM的问题
2021/06/02 Python