美文网首页
js相关-实用方法收集

js相关-实用方法收集

作者: 放风筝的小小马 | 来源:发表于2017-07-10 22:54 被阅读3次

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

    $(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相关-实用方法收集

          本文链接:https://www.haomeiwen.com/subject/uaauhxtx.html