スクロールイベントは複数回発生しますが、スクロールごとに1回呼び出す必要があります

Question

スクロールの方向に応じて関数を呼び出すことができます。つまり、goDown（）を呼び出してスクロールしてからgoUp（）を呼び出します。
は、ここに私のコードです：

$('.container').on('DOMMouseScroll mousewheel', function (e) { 
    if(e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) { 
     console.log('down'); 
     goDown(); 
    } else { 
     console.log('up'); 
     goUp(); 
    } 

    return false; 
    });  

しかし、我々は、それは私が望んでいたようでない倉庫（）またはgoUp（）を複数回発射されたスクロール場合、私はスクロールごとに一度、それを起動します。

Answer 1

ロダッシュのthrottleを使用してください。
以下の例では、1000（1s）は、再起動する前にonScroll()を呼び出さずに通過しなければならない時間です。

$('.container').on(
 
    'DOMMouseScroll mousewheel', 
 
    _.throttle(
 
     onScroll, 
 
     1000, 
 
     {trailing: false} 
 
    ) 
 
); 
 
    
 
    // your original function, named: 
 
    function onScroll (e) { 
 
    if(e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) { 
 
     console.log('scrolled down'); 
 
     // goDown(); 
 
    } else { 
 
     console.log('scrolled up'); 
 
     // goUp(); 
 
    } 
 

 
    return false; 
 
    }

.container { 
 
    height: 200vh; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"></div>

あなたは、開始時に、あなたの待機期間の終了時にonScroll()をしませ発射オプション（最後のparam）として...

{leading:false,trailing:true} 

を使用したい場合。

また、スロットルとデバウンスのためのjQueryプラグインがありますが、私はそれを使用していません。私が知っているのは、それが（_より）それぞれに少し異なる構文/アプローチを持っているということです。あなたのプロジェクトにLodashをロードしたくない場合は、気をつけてください。

Answer 2

あなたはタイムアウトでそれを作ることができます。

これは

t=onscroll=e=>clearTimeout(t,t=setTimeout('console.log("finished")',500)) 

または数以上のラインで自分のonelinerです：

var scrollWait, 
    scrollFinished =() => console.log('finished'); 
    window.onscroll =() => { 
    clearTimeout(scrollWait); 
    scrollWait = setTimeout(scrollFinished,500); 
    } 

このコードは500ミリ秒を待って、その後火災が終了しました。

これはあなた自身の状況に翻訳することができます。