使用逗号从 0 到 Value 的数字动画 - 从 var 中提取值
Animate numbers from 0 to Value with Comma - Value is pulled from var
正在努力解决这个问题,所以非常感谢任何想法或建议。
我有一个计算(有效)计算自 2021 年 1 月 1 日以来已经过去了多少天,并且 * 按一个值计算。我想在 3 秒内从 0 到值设置动画,但是,我不知道如何绕过逗号 - 没有逗号也可以让它工作。
有什么建议吗?
var startDate = new Date('01-01-2021');
var today = new Date();
var diff = Math.floor((today - startDate)/(1000*60*60*24))
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0');
var yyyy = today.getFullYear();
today = mm + '/' + dd + '/' + yyyy;
var answer = diff * 134256;
function commaSeparateNumber(val){
while (/(\d+)(\d{3})/.test(val.toString())){
val = val.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, ",");
}
return val;
}
document.getElementById("CCalc").innerHTML = (commaSeparateNumber(answer));
<p id="CCalc" class="fig-number"></p>
这是带有 jQuery 的代码:
var startDate = new Date('01-01-2021');
var today = new Date();
var diff = Math.floor((today - startDate)/(1000*60*60*24))
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0');
var yyyy = today.getFullYear();
today = mm + '/' + dd + '/' + yyyy;
var answer = diff * 134256;
function commaSeparateNumber(val){
while (/(\d+)(\d{3})/.test(val.toString())){
val = val.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, ",");
}
return val;
}
document.getElementById("CCalc").innerHTML = parseFloat(commaSeparateNumber(answer).replace(/,/g, ''));
$(".fig-number").each(function () {
$(this)
.prop("Counter", 0)
.animate(
{
Counter: $(this).text()
},
{
duration: 3000,
easing: "swing",
step: function (now, tween) {
// Check added for decimal number
if(parseInt(tween.end) == parseFloat(tween.end)){
var number = Math.ceil(now);
$(this).text(number.toLocaleString());
}
},
}
);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p id="CCalc" class="fig-number">39471264</p>
正在努力解决这个问题,所以非常感谢任何想法或建议。
我有一个计算(有效)计算自 2021 年 1 月 1 日以来已经过去了多少天,并且 * 按一个值计算。我想在 3 秒内从 0 到值设置动画,但是,我不知道如何绕过逗号 - 没有逗号也可以让它工作。
有什么建议吗?
var startDate = new Date('01-01-2021');
var today = new Date();
var diff = Math.floor((today - startDate)/(1000*60*60*24))
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0');
var yyyy = today.getFullYear();
today = mm + '/' + dd + '/' + yyyy;
var answer = diff * 134256;
function commaSeparateNumber(val){
while (/(\d+)(\d{3})/.test(val.toString())){
val = val.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, ",");
}
return val;
}
document.getElementById("CCalc").innerHTML = (commaSeparateNumber(answer));
<p id="CCalc" class="fig-number"></p>
这是带有 jQuery 的代码:
var startDate = new Date('01-01-2021');
var today = new Date();
var diff = Math.floor((today - startDate)/(1000*60*60*24))
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0');
var yyyy = today.getFullYear();
today = mm + '/' + dd + '/' + yyyy;
var answer = diff * 134256;
function commaSeparateNumber(val){
while (/(\d+)(\d{3})/.test(val.toString())){
val = val.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, ",");
}
return val;
}
document.getElementById("CCalc").innerHTML = parseFloat(commaSeparateNumber(answer).replace(/,/g, ''));
$(".fig-number").each(function () {
$(this)
.prop("Counter", 0)
.animate(
{
Counter: $(this).text()
},
{
duration: 3000,
easing: "swing",
step: function (now, tween) {
// Check added for decimal number
if(parseInt(tween.end) == parseFloat(tween.end)){
var number = Math.ceil(now);
$(this).text(number.toLocaleString());
}
},
}
);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p id="CCalc" class="fig-number">39471264</p>