事件偵聽器之間的延遲

Question

我有一個事件偵聽器檢測我何時滾動，當我滾動時，轉換發生在 CSS 到div ，但我想要一個延遲，所以你不能在它剛剛發生后立即執行事件。

document.addEventListener('wheel', event => {

  if (event.deltaY > 0) {
    wheel.style.transform = "transform";
  } else if (event.deltaY < 0) {
    wheel.style.transform = `transform * -1`;
  } else {
    return;
  }

  //I tried setTimeout but it didn't do anything for me, maybe I'm using it wrong?

  setTimeout((event) => {
    wheel.style.transform
    console.log("hi")
  }, 1000)

});

Answer 1

您需要使用setTimeout()來執行您只想執行的實際操作

在你現在的代碼中，它只是讓 wheel 事件在 100 毫秒后綁定它，一旦綁定並觸發事件，它將立即執行

// this will just make the event bind after 100ms to work
setTimeout((event) => {
    wheel.style.transform
    console.log("hi")
  }, 100)

我們可以改變它如下：

 document.addEventListener('wheel', event => { console.log("click event:" + new Date()) setTimeout(()=> { console.log("click event timeout:" + new Date()) if (event.deltaY > 0) { //wheel.style.transform = "transform"; } else if (event.deltaY < 0) { //wheel.style.transform = `transform * -1`; } else { return; } },3000) })