javascript - 当您滚动更多时,JQuery 滚动事件会继续触发

标签 javascript jquery html css

所以我有一个滚动事件,当用户滚动到网站上的某个点时会触发该事件。它会一直工作,直到你达到那个点并想继续滚动,然后它会随着每一个滚动而连续触发。我想开火一次,然后就不再开火了。

    $(window).on('scroll', function() {
    var y_scroll_pos = window.pageYOffset;
    var scroll_pos_test = 450;  // set to whatever you want it to be

    if(y_scroll_pos > scroll_pos_test) {
      alert("hey you hit it");
    }
});

我在下面设置了一个演示:

JSFiddle

最佳答案

当然,它会随着每次滚动而不断触发 - 您还没有删除滚动事件处理程序,如果用户继续向下滚动,if 条件对于后续滚动事件将继续为真。请注意,在用户到达页面的那一点之前 每次滚动时,处理程序也会触发,只是因为 if 而不会做任何值得注意的事情。

"I want to fire ONE time and then just not fire anymore."

显而易见的解决方案是调用 .off() method在不再需要时删除滚动处理程序:

$(window).on('scroll', function() {
    var y_scroll_pos = window.pageYOffset;
    var scroll_pos_test = 450;  // set to whatever you want it to be

    if(y_scroll_pos > scroll_pos_test) {
      $(window).off('scroll');  // <--- add this
      alert("hey you hit it");
    }
});

关于javascript - 当您滚动更多时,JQuery 滚动事件会继续触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42603306/

相关文章:

javascript - 如何在 getJSON 调用上处理 "Uncaught TypeError: Cannot set property ' prop' of undefined"?

javascript - Vue.js nextTick 在计算属性中

php - 在字符串中的三个字符后插入破折号的功能?

javascript - 激活单选按钮时显示 div

javascript - 通过点击传递数据以加载模态

javascript - 图像更改,在函数 onClick 中?可能使用 jQuery?

PHP - 使用 var_dump 时 SQL 查询返回 array(0) { }

php - 通过多用户网页重复执行linux程序而不崩溃

Javascript 图像平移/缩放

javascript - localstorage key本身占用多少空间?