布尔语句未在javascript

时间:2016-12-23 18:34:50

标签: javascript

我正在编写一个脚本,并且有两个布尔语句非常相似但给出了不同的结果,我不明白为什么它们会相互冲突。

我的功能如下:

SCRIPT:

(function() {
    window.onload = function() {
        let stopped = true;
        let button = document.getElementById("start-stop");

        if (stopped) {
           setInterval(function() {
               console.log("The timer is working.");
           }, 1000);
        }

        button.addEventListener('click', function(){
            if (stopped) {
                stopped = false;
                console.log(stopped);
            }  else {
                stopped = true;
                console.log(stopped);
            }
       });
   }
}
}).call(this);

基本思路是,当我按下按钮时setInterval功能停止,但即使if/else功能切换到false,它也会继续运行。

例如,我的console.log看起来像这样:

console log when my function is run.

即。 stopped = false,但setInterval不会终止。

为什么这不能正确评估?

4 个答案:

答案 0 :(得分:2)

您的代码存在的问题是您正在尝试处理已经开始运行的代码。简单来说,无论stop变量的值是什么,都会每1000ms调用一次setInterval方法。如果您希望真正停止日志,您可以执行以下任何操作:

clearInterval()

完全删除间隔或

       setInterval(function() {
          if (stopped) {
            console.log("The timer is working.");
          }
       }, 1000);

检查已停止变量的值是否已更改(单击后)并相应地执行操作。为您的目的选择其中任何一个..

答案 1 :(得分:2)

即使在单击按钮之前,您正在调用setinterval。由于事件已被触发,您无法仅通过将变量设置为false来停止,您需要使用clearinterval清除间隔

检查以下代码段

var intervalId;
window.onload = function() {
  let stopped = true;
  let button = document.getElementById("start-stop");
  var Interval_id;
  button.addEventListener('click', function() {
    if (stopped) {
      Interval_id = callTimeout();

      stopped = false;

    } else {

      clearInterval(Interval_id);
      stopped = true;
    }
  });
}

function callTimeout() {
  intervalId = setInterval(function() {
    console.log("The timer is working.");
  }, 1000);
  return intervalId;
}
<input type="button" id="start-stop" value="click it">

希望有所帮助

答案 2 :(得分:0)

if(stopped)语句放在setInterval函数中,因为如果你使用了这个函数,它会继续运行..

停止setInterval功能的另一种方法是使用clearInterval,就像这样

var intervalId = setInterval(function() { /* code here */}, 1000)
// And whenever you want to stop it
clearInterval(intervalId);

答案 3 :(得分:0)

单击按钮时,已停止的变量变为false,但setInterval将不会因为setInterval代码已执行而停止..按钮单击时不会再次执行。如果你重新加载页面,那么当你在第一行写入并且setInterval将再次执行时,已停止的变量将再次设置为true。

现在你可以做的是将setInterval存储在像这样的变量

var timer = setInterval(function,1000);

然后当您单击按钮时使用此方法清除间隔

clearInterval(timer);

这应该可以解决问题..希望它有所帮助..