kev*_*lar 9 jquery increment comma easing jquery-animate
我正在尝试在页面上的元素内增加一个数字.但是我需要用数字来包含第千个值的逗号.(例如45,000而不是45000)
<script>
// Animate the element's value from x to y:
$({someValue: 40000}).animate({someValue: 45000}, {
duration: 3000,
easing:'swing', // can be anything
step: function() { // called on every step
// Update the element's text with rounded-up value:
$('#el').text(Math.round(this.someValue));
}
});
</script>
<div id="el"></div>
Run Code Online (Sandbox Code Playgroud)
如何使用动画使用逗号增加数字?
Tat*_*nit 41
工作演示 http://jsfiddle.net/4v2wK/
您可以随意更改它以满足您的需求,您还可以查看货币格式化程序,希望这符合您的需求 :)
码
// Animate the element's value from x to y:
var $el = $("#el"); //[make sure this is a unique variable name]
$({someValue: 40000}).animate({someValue: 45000}, {
duration: 3000,
easing:'swing', // can be anything
step: function() { // called on every step
// Update the element's text with rounded-up value:
$el.text(commaSeparateNumber(Math.round(this.someValue)));
}
});
function commaSeparateNumber(val){
while (/(\d+)(\d{3})/.test(val.toString())){
val = val.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
}
return val;
}
Run Code Online (Sandbox Code Playgroud)
**输出*

Sup*_*OVA 10
您还应该添加一个完整的函数:
step:function(){
//..
},
complete:function(){
$el.text(commaSeparateNumber(Math.round(this.someValue)));
}
Run Code Online (Sandbox Code Playgroud)
更新小提琴:演示