zoukankan      html  css  js  c++  java
  • 手机端下拉刷新

    //获取滚动条位置

    function getScrollTop() {
    var scrollTop = 0;
    if(document.documentElement && document.documentElement.scrollTop) {
    scrollTop = document.documentElement.scrollTop;
    } else if(document.body) {
    scrollTop = document.body.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()) {
      //执行事件
      }
    }

    原理:

    代码做了一个判断getScrollTop() + getClientHeight() == getScrollHeight(),第一个函数获取滚动条的位置,第二个函数获取当前屏幕可见的高度,第三个函数获取当前文档的总高度,

    当前两个参数等等第三个参数的时候,就表示文档已经拉到底部了,触发事件向后台请求数据。这样一个分页功能就写出来了

  • 相关阅读:
    oracle常用sql语句
    Oracle存储过程基本语法介绍
    优美的代码:do...while(0)
    半同步半异步线程池
    C11线程管理:异步操作
    C11线程管理:原子变量&单调函数
    C11线程管理:条件变量
    C11线程管理:互斥锁
    C11线程管理:线程创建
    C11关键字&字面值改善
  • 原文地址:https://www.cnblogs.com/liubu/p/9012767.html
Copyright © 2011-2022 走看看