如何禁用刷卡並再次啟用？

Question

我有4個div元素充當頁面的代碼，在它們上滑動可將您帶到下一頁/上一頁。

function handleSwiping(allPagesArray){

    for(i=0; i<pageCount; i++){
        attachEvents(i);
    }

    function attachEvents(idx){
        var page = allPagesArray[idx];
        if(isVertical){
            te(page).on('swipeup', function (e) {
                gotoNextPage(idx);
            });
            te(page).on('swipedown', function (e) {
                gotoPrevPage(idx);
            });         
        } else {
            te(page).on('swipeleft', function (e) {
                gotoNextPage(idx);
            });
            te(page).on('swiperight', function (e) {
                gotoPrevPage(idx);
            });
        }
    }
}

gotoNextPage和gotoPrevPage函數中具有關鍵幀動畫。 我需要實現的是，在動畫開始之前，我想取消綁定這些滑動事件，並在動畫結束后再次綁定它們。 如果用戶在“轉到下一頁”動畫完成之前再次滑動，則需要這樣做。

我需要純JavaScript的解決方案。 jQuery或任何其他框架都不會。

有人可以幫忙嗎？

Answer 1

您可能有一個全局變量（或在某個對象中的某個位置） isSwiping 。

 te(page).on('swipeup', function (e) {
    if(!isSwiping) {
       isSwiping = true; 
       gotoNextPage(idx);
    }
 });

然后在動畫結束時將isSwiping設置為false