javascript onmouseover 激活的计时器应该只倒计时一次

Question

我的计时器是通过 onmouseover 函数激活的。

我的 CSS 动画在 15 秒后完成，但我的计时器没有完成。每次鼠标悬停后，时间都会重新激活，而不是按时间倒计时。

<span onmouseover="mouseHover()">Hover this text</span>

这会激活此功能:

function mouseHover() {
    startTimer();
}

var timer;

function startTimer() {
    window.clearTimeout(timer);
    timer = window.setTimeout(function(){
        getElementById("demo").innerHTML="Hovered!";
    },3000); 
}

注意:计时器正在工作( fiddle 除外)

如果您有任何建设性的反馈，请告诉我!谢谢

Jsfiddle JSfiddle 不适合我，我不知道为什么。

Answer 1

如果我理解正确，您可能想要执行以下操作。

在“vartimer”之后，您应该编写一个变量，例如“varexecuted = False”。然后，在 startTimer() 函数末尾写入“letexeced = True” - 这样，一旦函数第一次运行，变量 execed 现在将设置为 True。然后，您需要在运行函数之前确定代码之前是否已执行过，因此在 function mouseHover() 中，编写...

if (executed == False){
    startTimer()
};

因此该函数仅在之前未运行过的情况下运行!

编辑:将 mouseHover() 函数放在 'executed' 变量之后、startTimer() 函数之前。

编辑 2:我不应该使用“让执行= ...”，而只是使用“执行= ...”让我知道这是否有效。