zoukankan      html  css  js  c++  java
  • javascript&jquery 判断滚动到页面底部

    js 判断滚动到页面底部

    CreateTime--2018年4月14日10:13:07

    Author:Marydon

    1.使用场景:

      滚动到屏幕底部,触发加载分页数据请求(qq空间,手机端) 

    2.代码实现

      javascript方式 

    window.onscroll = function() {
        //获取被卷去高度
        var scrollTop = document.body.scrollTop;
        //获取窗口高度(可见区域高度)
        var windowHeight = document.documentElement.clientHeight;
        //获取文档高度
        var documentHeight = document.body.scrollHeight;
        if (scrollTop + windowHeight >= documentHeight) {
            $('#nomore').show();
            //发送Ajax请求获取分页数据
        }
    }

      jQuery方式

    $(window).scroll(function() {
        //获取被卷去高度
        var scrollTop = $(this).scrollTop();
        //获取窗口高度(可见区域高度)
        var windowHeight = $(this).height();
        //获取文档高度
        var documentHeight = $(document).height();
        if (scrollTop + windowHeight >= documentHeight) {
            $('#nomore').show();
            //发送Ajax请求获取分页数据
        }
    });

    区别:javascript的onscroll事件只能定义一次,而jQuery的scroll事件可以定义多次,还不会冲突。

     相关推荐:

              js 判断进入可视区域

  • 相关阅读:
    ADC和RTC的寄存器的读取
    串口中断
    chengdongyue的笔记
    UART速度的问题
    tags
    strtok
    exports、module.exports和export、export default到底是咋回事
    module.exports与exports,export与export default之间的关系和区别
    Vue2.x中的Render函数
    Vue的入门之安装
  • 原文地址:https://www.cnblogs.com/Marydon20170307/p/8830639.html
Copyright © 2011-2022 走看看