js相关-实用方法收集

在有滚动条的情况下,判断页面是否滚动到了底部

$(window).scrollTop(): 获取窗口滚动条的距离
$(window).height():获取窗口可视部分的高度
$(document).height():获取整个页面的高度= 滚动条的高度+可视窗口高度

 function isScrollBottom(){
   if ($(window).scrollTop() + $(window).height() >= $(document).height()) {
        return true;
   }
   return false;
 }
$(window).scroll(function(){
      if (isScrollBottom()) {
        barrel.perLoadImgNum = 20;
        barrel.loadImg();
      }
    });

如何判断一个点击事件不是落在指定元素上

可以利用事件的冒泡机制来处理
分为两步:

  • 阻止指定元素上click事件的冒泡机制,那么点击在该元素时,它的祖先元素不会获得click事件
  • 在该元素的祖先元素上绑定click事件,当它获得click事件时,说明点击事件发生了,并且该事件不是在指定元素上,因为我们阻止了指定元素上的click事件

以下代码是:判断click事件是否作用在this.$ct对象上

// document是this.$ct的祖先元素
$(document).on('click', function(e){
   // 进入这里,说明点击事件不是发生在this.$ct对象
   if (_this.$calendar.css("display") !== 'none') {
      _this.$calendar.fadeOut(100);
  }
});
// 为this.$ct对象绑定click事件
this.$ct.on('click', function(e){
   var $target = $(e.target);
   // 阻止事件冒泡
   e.stopPropagation();
}

你可能感兴趣的:(js相关-实用方法收集)