Question

我正在创建一个网页，用户可以在5秒内多次点击按钮。目前，计时器在最初加载页面时启动。但是，我想在用户第一次点击“点击”按钮时启动计时器。按钮，并且每次用户在第一次单击后单击按钮时都不会重置。

关于如何做到这一点的任何想法？提前谢谢。

HTML按钮：

<div class='buttonDiv'>
        <button onclick='countClicks()' id='click' type="button">Click Me!</button>
    </div>

Javascript函数：

/*record clicks*/
var clicks = 0;

function countClicks(){
document.getElementById('click').value = ++clicks;
document.getElementById('result').innerHTML = clicks;
}


/* Timer countdown */
var secs=5;
var counter=setInterval(timer, 1000);

function timer(){
 secs--;
 if (secs <= 0){
 clearInterval(counter);
 document.getElementById("click").disabled = true;

 document.getElementById("seconds").innerHTML=0;
 return;

 }
 document.getElementById("seconds").innerHTML=secs;
}

Answer 1

只需声明计数器变量，然后检查它是否在函数内设置：

var counter;

function countClicks(){

    if( !counter ){//counter is not set

        counter = setInterval(timer, 1000);

    } else {

        document.getElementById('click').value = ++clicks;
        document.getElementById('result').innerHTML = clicks;
    }
}

首次点击按钮激活计时器

1 个答案: