滚动翻页

2018-12-13  本文已影响0人  easy_mark

利用根节点dom元素高度-可是区域高度-滚动条距顶部距离,得到的差值去判断,如果差值为0即滚动条触底,触发事件。

 //取窗口可视范围的高度
    getClientHeight() {
      let clientHeight = 0;
      if(document.body.clientHeight && document.documentElement.clientHeight) {
          clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight :   
          document.documentElement.clientHeight;
      } else {
         clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : 
         document.documentElement.clientHeight;
      }
      return clientHeight;
    },
  
  handleScroll(){
      let allHeight = $("#app")[0].offsetHeight
      let tpScrollTop = document.body.scrollTop+document.documentElement.scrollTop;
      let clientH = this.getClientHeight()
      if((allHeight-tpScrollTop-clientH )<=20){
        this.getList(this.selected)
      }
    },

window.addEventListener('scroll',this.handleScroll)
上一篇下一篇

猜你喜欢

热点阅读