Question

你好朋友我试图用循环显示数字1到4一个循环我的代码是

<script>
    $(document).ready(function(){       
        setInterval(function() {            
            var i = 1;
            for(i=0; i<=5; i++)
            {
                var dis = $('#fade');                   
                dis.html(i);                    
                i++;
            }           
        }, 2000);
    });    
</script>

但显示结果编号并停止工作plz帮助我提前致谢

Answer 1

如果您只想显示从1到4的数字，我建议您按以下方式使用setTimeout：

var counter = 1;
$(function() {
  incrementCounter();
});

function incrementCounter() {
  $('#fade').html(counter);
  counter++;
  if (counter < 4) {
    setTimeout(incrementCounter, 2000);
  }
}

另一种选择是：

$(function() {
  for (var i = 1; i <= 4; i++) {
    setTimeout(function() {
      $('#fade').html(counter);
    }, (i - 1) * 2000);
  }
});

Answer 2

你走了：http://jsfiddle.net/eN2se/2/
您不能一次调用所有setInterval函数，它们会直接执行。
更新：使用setTimeout

$(document).ready(function() {
  var display = function(i) {
    $('#fade').html(i);
    if (i < 4) {
        setTimeout(function() {display(++i)}, 1000);
    }                    
  };
  display(1);
});

Answer 3

删除第二个document ready - 这完全是多余的。

Answer 4

我认为您想要实现的计数器可以使用此代码完成（虽然我不确定我是否理解正确）：

$(document).ready(function(){

        var counter = 1,
            max = 5;

        var timer = setInterval(function() {

           $('#fade').html( counter );

           counter += 1;     

           // stop after <max> iterations
           if ( number > max ) {
              window.clearInterval( timer );
           }

        }, 2000);
});

Answer 5

$(document).ready(function() {
        var counter = 1;
        var timerId = -1;

        timerId = setInterval(function() {
           if(counter == 5) clearInterval(timerId);
           $('#fade').html( counter );

           counter += 1;     

        }, 2000);
});

http://jsfiddle.net/Z5BMn/8/

Answer 6

查看以下内容

$(function(){    
        setInterval(function() {
        for(i=0; i<=5; i++)
        {
            $('#fade').append(i);                  
        }       

    }, 2000);
    })

Answer 7

使用jasd的例子我添加了另一行代码，使其重复。

var counter = 1;
$(function() {
  incrementCounter();
});

function incrementCounter() {
  $('#fade').html(counter);
  counter++;
  if (counter <= 5) {
    setTimeout(incrementCounter, 2000);
  }else{
      counter = 1;
      setTimeout(incrementCounter, 2000);
  }
}

http://jsfiddle.net/BMnvX/2/

设置interval（）不会逐个显示数字

7 个答案: