Question

我的计时器由onmouseover功能激活。

我的css动画在15秒后完成，但我的计时器没有。每次onmouseover后重新激活时间，而不是按时倒计时。

<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); 
}

注意：计时器正在运行（小提琴除外）

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

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

Answer 1

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

＆＃39; var timer＆＃39;你应该写一个像＆＃39; var executed = False＆＃39;这样的变量。然后，在startTimer()功能结束时，写下let executed = True＆＃39; - 这样一旦第一次运行该函数，变量executed现在将设置为True。然后，您将在运行该函数之前确定代码是否先前已执行过，因此在function mouseHover()中，写入...

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

因此该功能仅在之前没有运行时才会运行！

<强> 编辑： 在执行＆＃39;之后放置mouseHover()功能。变量但在startTimer()函数之前。

编辑2： 我不应该使用＆＃39;让执行= ...＆＃39;，只是执行= ...＆＃39; 如果有效，请告诉我。

Answer 2

编辑：我误解了你的问题。你需要它只执行一次。添加新变量以标记事件是否已启动。

var timer, started = false;

var startTimer = function() {

    if(started) return;
    started = true;

    window.clearTimeout(timer);
    ...

}

window.mouseHover = function() {
    startTimer();
}

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

2 个答案: