zoukankan      html  css  js  c++  java
  • 原生js触碰到底部触发函数;

      /**
      function __morebook(){
        console.log(123)
      }
      ScrollBottom(function(){__morebook();});
      **/
    
      //如果直接写一个如下:
      //  ScrollBottom 方法里有个参数x,x作为函数带参数。然后通过doFun去调用;
      //  为何doFun做为参数也调用了,是因为方法里有个setTimeOut;
      //  这样写的意义是什么呢?是将scrollBottom写成公用方法,可以通过任何方式点击或者滚动都可以调用;
      ScrollBottom(function(){console.log('碰到底部:',123)})
      //点击: $("jsMoreTip").click(function () { __morebook() });
    
          //滚动条到底部触发的事件
      function ScrollBottom(x){
        function __getScrollTop(){
            var scrollTop = 0, bodyScrollTop = 0, documentScrollTop = 0;
            if(document.body){bodyScrollTop = document.body.scrollTop;}
            if(document.documentElement){documentScrollTop = document.documentElement.scrollTop;}
            scrollTop = (bodyScrollTop - documentScrollTop > 0) ? bodyScrollTop : documentScrollTop;
            return scrollTop;
        }
        function __getWindowHeight(){
            var windowHeight = 0;
            if(document.compatMode == "CSS1Compat"){
            windowHeight = document.documentElement.clientHeight;
            }else{
              windowHeight = document.body.clientHeight;
            }
            return windowHeight;
        }
        function __getScrollHeight(){
            var scrollHeight = 0, bodyScrollHeight = 0, documentScrollHeight = 0;
            if(document.body){bodyScrollHeight = document.body.scrollHeight;}
            if(document.documentElement){documentScrollHeight = document.documentElement.scrollHeight;}
            scrollHeight = (bodyScrollHeight - documentScrollHeight > 0) ? bodyScrollHeight : documentScrollHeight;
            return scrollHeight;
        }
        window.onscroll = function(){
            if(__getScrollTop() + __getWindowHeight() == __getScrollHeight())
            doFun(x)
        };
      }
      function doFun(x){setTimeout(x,0)}
  • 相关阅读:
    [jenkins] 启动错误 Failed to start LSB: Jenkins Automation Server.
    SpringBoot AOP注解式拦截与方法规则拦截
    JS !function 稀奇古怪的写法
    业务场景后端优化
    对称加密和非对称加密
    第三篇 -- 余生,我累了,也懂了
    第二篇 -- 关东野客书籍
    第十一篇 -- 关于防火墙的一些问题
    第三十一篇 -- 学习第六十八天打卡20190911
    第二十九篇 -- UDP和TCP
  • 原文地址:https://www.cnblogs.com/weiyf/p/9876593.html
Copyright © 2011-2022 走看看