使用JavaScript中的计时器停止显示块/无闪烁

我似乎无法理解这里的逻辑。我有一个元素，在移动鼠标之前一直隐藏（

utilBar

），如果鼠标仍在移动，我希望它在计时器结束后仍保持显示。很明显，我想的是，在鼠标移动时，启动一个计时器并显示元素，如果在第一次鼠标移动后有另一次鼠标移动，则停止计时器并重复启动，因此只要鼠标移动，计时器就不会结束

问题是我的元素在1000毫秒后闪烁，在我移动鼠标时闪烁开/关。我想我只是被这里的逻辑绊倒了，但我想不出来

//Separate function to pass in utilBarTimer into the setTimeout
function timerFunction(utilBarTimer){
  self.iframe.addEventListener('mousemove',function(){
    clearTimeout(window.utilBarTimer);
  });
  utilBar.style.display = 'none';
}
self.iframe.addEventListener('mousemove',function(){
  utilBar.style.display = 'block';
  var utilBarTimer = window.setTimeout(function(){
    timerFunction(utilBarTimer)
  },1000);
});

---

您当前的做法是创建一个新的

EventListener

，它将在每次鼠标移动时清除超时。我认为你要寻找的逻辑是：

var utilBar = document.getElementById('utilBar'),
    utilBarTimer;

window.addEventListener('mousemove', function() {
    utilBar.style.display = 'block';

    // if we have a timer already running, kill it out
    if (utilBarTimer) {
        clearTimeout(utilBarTimer);   
    }

    // begin a new timer that hides our object after 1000 ms
    utilBarTimer = window.setTimeout(function() {
        utilBar.style.display = 'none';
    }, 1000);
});

---

这是它的。

看起来您正在将计时器本身传递给timerFunction，那么为什么要在窗口上调用clearTimeout。UtilPartimer？我不确定是否理解？我正在取消Timer功能，每次都会启动一个新功能。window.utilBarTimer==utilBarTimer。如果我移除“窗口”（如果这是你的意思？），那么同样的事情也会发生。啊，是的。我甚至没想过要检查是否有utilBarTimer套装。谢谢，工作很有魅力！