jquery - jQuery - スクロールを単一のイベントとして扱う方法は?

Question

関数をスクロールにバインドし、マウスホイールを 1 回スクロールすると、関数は 7 回または 8 回実行されます。マウスホイールを1回スクロールしたときに1回だけ実行したいのですが、これは可能ですか? 私はこのコードを使用します：

$(document).ready(function () {
    $(window).bind('scroll', function() {
        alert("Scroll.");          
    }   
    });
});

Answer 1

試す

$(document).ready(function () {
    var timerId;
    $(window).bind('scroll', function() {
        clearTimeout(timerId)
        timerId = setTimeout(function(){
            alert("Scroll.");          
        }, 200)
    });
});

デモ:フィドル

Answer 2

jQuery スロットル デバウンスプラグインからスロットル機能を使用できます。

$(function() {
    $(window).bind('scroll', $.throttle(100, function() {
        console.log('scroll');
    }));
});

Answer 3

スクロールを 1 回だけ検出する場合は、次のようにします。

$(function () {
    var done = false;
    $(window).bind('scroll', function() {
       if (!done){
           alert("Scroll.");
           done = true;
       }
   });
});

ただし、すべてのスクロールイベントを検出したい場合は、答え4のようなものを試してください

Answer 4

「1 回」とは、ページ読み込みごとに 1 回という意味であれば、off()メソッドを使用してリスナー内のイベントのバインドを解除できます。 http://api.jquery.com/off/

次のような名前空間イベントの可能性もあります。

scroll.namespace は同じイベントですが、具体的にバインドを解除できます。

$(document).ready(function () {
    $(window).on('scroll.myEvent', function() {
        $(window).off('scroll.myEvent');
        alert("Scroll.");          
    }   
    });
});