Question

wheel事件，doStg会做一些动画，必须先完成动画，然后再执行其他操作：

document.addEventListener('wheel', doStg, false)

let numb = 0

function doStg() {
    console.log(numb++)
}

我想做什么：

仅在上一个doStg完成后，才将doStg添加到调用堆栈中。

我可以做这样的事情：

document.addEventListener('wheel', doStg, false)

let count = 0
let eventController = 0

function doStg() {
  if (eventController === 0) {
    console.log(count++)

    eventController++

    setTimeout(function() {
      eventController = 0
    }, 3000)
  } 
}

现在该功能仅每3秒触发一次。有没有更好的方法？

Answer 1

如果先前的调用未完成，您可以使全局标志立即退出功能

document.addEventListener('wheel', doStg, false)
let isExecuting = false;
let numb = 0

function doStg() {
    if(isExecuting) return; // exit if there is already executing something

    isExecuting = true; // prevent next call
    console.log(numb++)
    // do something
    isExecuting = false; // enable for next
}

调用函数以响应javascript中的wheel事件，但仅当对同一事件的上一个函数调用完成时

我想做什么：

1 个答案: