我希望为一个从 0 到给定值的计数器设置动画。
我试过使用 for()
循环,但它卡住了,然后只显示结束值。
//HTML
<input type="hidden" value="100000" id="amount"/>
<input type="text" value="0" id="count"/>
<input type="button" value="run" id="runner"/>
//JS
$('#runner').click(function(){
var amount=parseInt($('#amount').val());
for(i=0;i<=amount;i++)
{
$('#count').val(i);
setTimeout(1);
}
});
你可以在这里看到它:http://jsfiddle.net/P4Xy6/1/
知道如何显示 0 和给定值之间的值吗?或者有更好的方法吗?
最佳答案
这应该可以做到..
$('#runner').click(function(){
var amount=parseInt($('#amount').val());
var counter = 0;
var interval = setInterval(function(){
$('#count').val(counter++);
if (counter > amount){
clearInterval(interval);
}
},100); // the value 100 is the time delay between increments to the counter
});
演示在 http://jsfiddle.net/gaby/rbZq3/
还有一个更优化的(通过缓存对 #count
元素的引用)在 http://jsfiddle.net/gaby/rbZq3/2/
关于javascript - 显示计数器的自动增量值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9520562/