再次触发时，计时器的运行速度提高一倍答案

【问题标题】：Timer goes twice as fast when triggered again再次触发时，计时器的运行速度提高一倍
【发布时间】：2015-09-11 05:59:25
【问题描述】：

我需要创建一个将整数放入数组的系统。但我有一个问题。当我单击 div 时，它可以工作，但是当我再次单击时，计时器会快两倍。我怎样才能防止这个问题？

代码：

    // JavaScript Document
// DIT STUK ZORGT VOORT HET CLICK EVENT BIJ FUNCTION INIT
function addListener(element, type, expression, bubbling) {
    if(window.addEventListener) { // Voor alle !IE browsers
    element.addEventListener(type, expression, bubbling);
    return true;
    } else if(window.attachEvent) { // Voor oude IE versies
    element.attachEvent('on' + type, expression);
    return true;
    } else {
    return false; }
}

var mijnArray = [];
var Timer;

// Bij het laden van de pagina
function init ()
{
    addListener (document.getElementById("resultaat"), 'click', startTimer, false);
}

// Deze functie start wanneer er double geklikt is op de div
function startTimer ()
{
    //alert('test');
    Timer = setInterval(function(){myTimer()},100); 
}

function myTimer () 
{
    // uitvoeren zolang aantal items kleiner is als 11
    if (mijnArray.length < 10)
    {   
        mijnArray.push(Math.floor((Math.random() * 10) + 1));
        console.log(mijnArray);
        document.getElementById('resultaat').innerHTML = mijnArray;
    }
    else
    {
        clearInterval(Timer);   
    }

}
















window.onload = init;

【问题讨论】：

你能把你的代码提炼成最小的吗？

标签： javascript html arrays function timer

【解决方案1】：

始终假设您的计时器正在运行，在启动之前取消它

function startTimer() {
    clearInterval(Timer);
    Timer = setInterval(myTimer, 100); 
}

或者，始终保持间隔运行，但有一个标志来控制是否发生任何事情；

var do_something = false;

var Timer = setInterval(function () {
    if (do_something) myTimer(); // your function
}, 100);

function click_handler() {
    do_something = true;
}

与间隔一样，您可能需要考虑这样一种情况，即调用的函数完成所需的时间比重新调用它之前的间隔等待时间长。如果您遇到这种情况，请考虑使用setTimeout 重写它

【讨论】：

【解决方案2】：

当您单击按钮时，您正在设置一个间隔。但是，由于按钮不知道其他时间间隔，所以当您单击按钮时，您会创建一个新计时器，而不管旧计时器是否正在运行！

具体取决于您想要的行为：

在计时器运行时禁用按钮：您可以在单击按钮时从按钮中移除侦听器，直到计时器完成。（去掉 startTimer 末尾的监听器，在 myTimer 的 else 子句中调用 init 重新启用定时器按钮）。
让按钮重新启动计时器：只需在计时器上运行 clearInterval，然后再次启用计时器。

【讨论】：