增量不适用于setInterval

时间:2017-06-11 04:44:54

标签: javascript

当你给程序一个种子和最大值时,它会遍历每个数字并将它除以2和3并显示余数。我希望它在它解决它的时间和下一个之间给出一秒。但每当我尝试使用setInterval时,即使在2个不同的编辑器上,它也会冻结和崩溃。我还有另一个问题,因为当你输入一个种子和max输入框时,它不会保存数字,它使用的是javascript而不是输入框。在此先感谢,我是11岁,并在几个月前开始编程。

这是我到目前为止所做的:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Made with Thimble</title>
<link rel="stylesheet" >
</head>
<body bgcolor="lightblue">
<div id="d2">
Divisible by 2
</div>
<div id="d3">
Divisible by 3 
</div>
<div>
  <input id="seed" type="number" placeholder="seed" value="3"><br>
<input id="max" type="number" placeholder="max" value="8">
</div>
<button onclick="count()">Count</button>
<div id="output"></div>
<script>
 function count(){

 var seed= document.getElementById("seed").getAttribute("value")
var max=document.getElementById("max").getAttribute("value")
var temp=1
var output=document.getElementById("output")
 temp=seed
console.log("seed:"+seed)
console.log("max:"+max)
 while (temp<max){

 var intdivby2 = temp%2
  var intdivby3 = temp%3

 document.getElementById("output").innerHTML+="remainder of "+temp+" divided 
 by 2 is:"+intdivby2.toString()+"<br>"
 document.getElementById("output").innerHTML+="remainder of "+temp+" divided 
  by 3 is:"+intdivby3.toString()+"<br>"
 setInterval(function(){temp++;},1)

    }
        }
          </script>
            </body>
      </html>

2 个答案:

答案 0 :(得分:2)

网站崩溃是因为您在循环内调用setInterval()。因此,对于循环的每个循环,正在创建新的计时器。这不是你想要发生的事情。

以下是您需要解决的问题:

  1. setInterval()的第二个参数是毫秒的时间,而不是秒。因此,您必须将其更改为1000.(1秒= 1000毫秒)。

  2. 删除循环并仅调用setInterval()一次。在每1秒发生一次的函数中,增加temp的值并执行必要的操作。

  3. 一旦temp超过max的值,请致电clearInterval()以停止计时器。

  4. 这是修订后的count()函数:

    function count() {
        var seed= document.getElementById("seed").getAttribute("value")
        var max=document.getElementById("max").getAttribute("value")
        var temp=1
        var output=document.getElementById("output")
        temp=seed
        console.log("seed:"+seed)
        console.log("max:"+max)
        var id = setInterval(function(){
            var intdivby2 = temp%2
            var intdivby3 = temp%3
    
            document.getElementById("output").innerHTML+="remainder of "+temp+" divided by 2 is:"+intdivby2.toString()+"<br>"
            document.getElementById("output").innerHTML+="remainder of "+temp+" divided by 3 is:"+intdivby3.toString()+"<br>"
            temp++;
            if (temp > max) clearInterval(id);
        },1000)
    }
    

答案 1 :(得分:1)

你已经while循环了。不要使用setInterval来解决循环问题。请删除setInterval并添加temp++。而你的陈述不是正确关闭。每行结尾添加;

已更新

在时间间隔内直接使用setInterval代替while

&#13;
&#13;
function count() {
  var seed = document.getElementById("seed").getAttribute("value")
  var max = document.getElementById("max").getAttribute("value")
  var temp = 1
  var output = document.getElementById("output")
  temp = seed
 // console.log("seed:" + seed)
  //console.log("max:" + max)
  var timer = setInterval(function(){ 
  
  if(temp < max) {
    var intdivby2 = temp % 2
    var intdivby3 = temp % 3
    document.getElementById("output").innerHTML += "remainder of " + temp + " divided by 2 is: " + intdivby2.toString() + " <br> "
    document.getElementById("output").innerHTML += "remainder of " + temp + " divided by 3 is: " + intdivby3.toString() + " <br> ";
    temp++
  }
  else{
  clearInterval(timer)
  }
  },500)
}
&#13;
<body bgcolor="lightblue">
  <div id="d2">
    Divisible by 2
  </div>
  <div id="d3">
    Divisible by 3
  </div>
  <div>
    <input id="seed" type="number" placeholder="seed" value="3"><br>
    <input id="max" type="number" placeholder="max" value="8">
  </div>
  <button onclick="count()">Count</button>
  <div id="output"></div>
&#13;
&#13;
&#13;