jQuery 在点击事件后滚动侦听器

Question

点击事件后激活滚动侦听器的正确方法是什么？

我目前正在使用：

$('.button').click(function (event) {
   $(window).on("scroll", someFunction);
}

someFunction = function() {
   //do stuff 
   $(window).off("scroll"); //disable scroll listener
}

在单击事件中，我启用运行s someFunction 的滚动侦听器。该函数执行一些操作并在完成时禁用滚动侦听器。单击时再次启用滚动侦听器。

我担心的是我做得不对。请指教！

注意：滚动侦听器不能运行无限期。它从点击开始，必须在 myFunction 结束时结束。

注意：我并不是要检测用户何时停止滚动...

Answer 1

您可以通过以下方式进行：

$('.button').click(function (event) {
   $(window).bind("scroll", someFunction);
}

someFunction = function() {
   //do stuff 
   $(window).unbind("scroll"); // remove scroll listener
}

Answer 2

每次单击都会添加一个额外的滚动事件侦听器。我会用一个附加变量封装绑定：

var isScrollBindingActive = false;
$('.button').click(function (event) {
    if (!isScrollBindingActive) {
        isScrollBindingActive = true;
        $(window).on("scroll", someFunction);
    }
}

someFunction = function() {
   //do stuff 
   $(window).off("scroll"); //disable scroll listener
   isScrollBindingActive = false; // allow binding again if wished
}

Answer 3

你可以使用 jQuery .one():

$('.button').on('click', function() {
    $(window).one('scroll', someFunction);
});

jQuery 在点击事件后滚动侦听器

jQuery on scroll listener after click event

javascript

jquery

jquery-events