Javascript函数setInterval()只能运行一次

时间:2014-12-30 02:54:27

标签: javascript setinterval

专家! 我想问一下Javascript函数setInterval()。 我的问题是setInterval()只能工作一次,而不是重复。

这是我的HTML代码

<button id = 'btun' name = 'btun' onclick = 'changecolor();' class = 'btn btn-success btn-block'>Color Change</button>

和Javascript代码

function below(t){
  var button = document.getElementById('btun');
  var quadrant = (t*t + 2*t + 1)+"px";
  console.log('ye');
  button.style.marginTop = quadrant;
  document.write(pix);
}
var doBelow = setInterval(below(t++),1);
if(t > 50){
  clearInterval(doBelow);
}

我无法找到问题所在。

2 个答案:

答案 0 :(得分:3)

setInterval甚至不能正常工作。调用该函数的原因是您在尝试使用setInterval时调用它,并且在undefined调用中使用函数的返回值(setInterval

使用函数表达式创建调用below(t++)的时间间隔。你可以将检查t > 50条件的代码放在函数中,否则它也只运行一次。

function below(t){
  var button = document.getElementById('btun');
  var quadrant = (t*t + 2*t + 1)+"px";
  console.log('ye');
  button.style.marginTop = quadrant;
  document.write(pix);
  if(t >= 50){
    clearInterval(doBelow);
  }
}

var doBelow = setInterval(function() { below(t++); },1);

注意:在间隔中使用document.write不是一个好主意。在页面完成后运行时,它将打开一个要写入的新页面来替换当前页面。

答案 1 :(得分:3)

setInterval期望回调作为第一个参数,但是您正在调用实际函数。

呼叫应如下所示

 setInterval(function() {
      below(t++); }
  ,1);

所以在这里你要创建一个匿名回调函数,它将在下面调用你的函数。最好将退出条件t >= 50放在below函数