Question

我试图让我的按钮在10秒倒数计时器结束后停止计算点击次数，但我不知道如何正确停止它。

当我尝试使用时： if（秒＆lt; 1）

然后它在控制台中出现了这个错误：

Uncaught ReferenceError: 
  seconds is not defined
  at onClick ((index):60)
  at HTMLButtonElement.onclick ((index):18)
onClick @ (index):60
onclick @ (index):18

有人可以帮我这个吗？

到目前为止，这是我的代码：

<body>
<p align="center">
<button class="button" style="width:500px;height:200px;" id="submit2" onClick="onClick()" align="center">Click me!</button>
</p>

<div id="countdowntimertxt" class="countdowntimer" align="center">00:00</div>

<script type="text/javascript">
var sTime = new Date().getTime();
var countDown = 10; // Number of seconds to count down from.        

function UpdateCountDownTime() {
    var cTime = new Date().getTime();
    var diff = cTime - sTime;
    var timeStr = '';
    var seconds = countDown - Math.floor(diff / 1000);
    if (seconds >= 0) {
        var hours = Math.floor(seconds / 3600);
        var minutes = Math.floor( (seconds-(hours*3600)) / 60);
        seconds -= (hours*3600) + (minutes*60);
        if( hours < 10 ){
            timeStr = "" + hours;
        }
        if( minutes < 10 ){
            timeStr = timeStr + ":0" + minutes;
        }else{
            timeStr = timeStr + ":" + minutes;
        }
        if( seconds < 10){
            timeStr = timeStr + ":0" + seconds;
        }else{
            timeStr = timeStr + ":" + seconds;
        }
        document.getElementById("countdowntimertxt").innerHTML = timeStr;
    }else{
        document.getElementById("countdowntimertxt").style.display="none";
        clearInterval(counter);
    }
}
UpdateCountDownTime();
var counter = setInterval(UpdateCountDownTime, 500);

var clicks = 0;
function onClick() {
    if (seconds < 1) {
        clearInterval(clicks)
    }else{
        clicks += 1;
        document.getElementById("clicks").innerHTML = clicks;
    }
};
</script>

<p align="center">Clicks: <a id="clicks">0</a></p>
</p>
</body>

Answer 1

您在seconds内定义UpdateCountDownTime()，但也可以在onClick中访问它。 onClick中的值（因为我们以非严格模式运行）将在全局范围内，并且为undefined。由于undefined < 1将始终评估为false，因此永远不会从点击中清除该时间间隔。

您可以尝试在var seconds之外添加UpdateCountDownTime然后更新，即

var sTime = new Date().getTime();
var countDown = 10; // Number of seconds to count down from.        
var seconds = 10; // Number of remaining seconds
function UpdateCountDownTime() {
    var cTime = new Date().getTime();
    var diff = cTime - sTime;
    var timeStr = '';
    seconds = countDown - Math.floor(diff / 1000);

Answer 2

＆＃13;

var sTime = new Date().getTime();
var countDown = 10; // Number of seconds to count down from.        
var seconds;
function UpdateCountDownTime() {
    var cTime = new Date().getTime();
    var diff = cTime - sTime;
    var timeStr = '';
    seconds = countDown - Math.floor(diff / 1000);
    if (seconds >= 0) {
        var hours = Math.floor(seconds / 3600);
        var minutes = Math.floor( (seconds-(hours*3600)) / 60);
        seconds -= (hours*3600) + (minutes*60);
        if( hours < 10 ){
            timeStr = "" + hours;
        }
        if( minutes < 10 ){
            timeStr = timeStr + ":0" + minutes;
        }else{
            timeStr = timeStr + ":" + minutes;
        }
        if( seconds < 10){
            timeStr = timeStr + ":0" + seconds;
        }else{
            timeStr = timeStr + ":" + seconds;
        }
        document.getElementById("countdowntimertxt").innerHTML = timeStr;
    }else{
        document.getElementById("countdowntimertxt").style.display="none";
        clearInterval(counter);
    }
}
UpdateCountDownTime();
var counter = setInterval(UpdateCountDownTime, 500);

var clicks = 0;
function onClick() {
    if (seconds < 1) {
        clearInterval(clicks)
    }else{
        clicks += 1;
        document.getElementById("clicks").innerHTML = clicks;
    }
};

＆＃13;

<p align="center">
<button class="button" style="width:500px;height:200px;" id="submit2" onClick="onClick()" align="center">Click me!</button>
</p>

<div id="countdowntimertxt" class="countdowntimer" align="center">00:00</div>

<p align="center">Clicks: <a id="clicks">0</a></p>
</p>

＆＃13;

var seconds应该是全局变量。

计时器完成后，尝试停止计算点击次数

2 个答案: