如何格式化不断变化的跨度？

$<span id="money">0</span>

我有这个跨度显示多少钱。这个数字不断更新，因为这是我正在制作的一个闲置游戏。如何格式化不断变化的跨度？

function moneyClick(number) { 
    money = money + number; 
    document.getElementById("money").innerHTML = money; 
    lifetimeearnings = lifetimeearnings + number; 
    document.getElementById("lifetimeearnings").innerHTML = lifetimeearnings; 
}; 

window.setInterval(function() { 
    moneyClick(thugs); 
    moneyClick(assassins * 3); 
    moneyClick(farms * 5); 
    moneyClick(lawyers * 11); 
    moneyClick(rackets * 23); 
    document.getElementById('thugEarn').innerHTML = thugEarn; 
    document.getElementById('thugs').innerHTML = thugs; 
    document.getElementById('assassinEarn').innerHTML = assassinEarn; 
    document.getElementById('assassins').innerHTML = assassins; 
    document.getElementById('farmEarn').innerHTML = farmEarn; 
    document.getElementById('farms').innerHTML = farms; 
    document.getElementById('lawyerEarn').innerHTML = lawyerEarn; 
    document.getElementById('lawyers').innerHTML = lawyers; 
    document.getElementById('racketEarn').innerHTML = racketEarn; 
    document.getElementById('rackets').innerHTML = rackets; 
}, 1000);

span由上述两个函数在javascript中更新。我想格式化跨度以逗号显示货币，例如1234将变为1,234，1234567将变为1,234,567。

我已经看到有办法做到这一点，但是当跨度不断更新时，他们都没有工作。有没有办法在不断更新文本的同时保持文本格式？

来源

2017-09-20 FatboyJames

难道你不能每次改变它，重新插入它适当的格式？ –

类似于：'document.getElementById（“money”）。innerHTML = insertCommas（money）;' –

在将数字添加到DOM之前，只需将逗号添加到数字中即可。

//A function to add commas to the number 
    var formatNumber = function (number) { 
     var splitNum; 
     number = Math.abs(number); 
     number = number.toFixed(2); 
     splitNum = number.split('.'); 
     splitNum[0] = splitNum[0].replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
     return splitNum.join("."); 
    } 

    function moneyClick(number) { 
     money = money + number; 

     //Add commas to the number before update the DOM 
     document.getElementById("money").innerHTML = formatNumber(money); 

     lifetimeearnings = lifetimeearnings + number; 
     document.getElementById("lifetimeearnings").innerHTML = lifetimeearnings; 
    }; 

    window.setInterval(function() { 
     moneyClick(thugs); 
     moneyClick(assassins * 3); 
     moneyClick(farms * 5); 
     moneyClick(lawyers * 11); 
     moneyClick(rackets * 23); 
     document.getElementById('thugEarn').innerHTML = thugEarn; 
     document.getElementById('thugs').innerHTML = thugs; 
     document.getElementById('assassinEarn').innerHTML = assassinEarn; 
     document.getElementById('assassins').innerHTML = assassins; 
     document.getElementById('farmEarn').innerHTML = farmEarn; 
     document.getElementById('farms').innerHTML = farms; 
     document.getElementById('lawyerEarn').innerHTML = lawyerEarn; 
     document.getElementById('lawyers').innerHTML = lawyers; 
     document.getElementById('racketEarn').innerHTML = racketEarn; 
     document.getElementById('rackets').innerHTML = rackets; 
    }, 1000);

来源

2017-09-20 18:47:20 Thusitha

非常感谢。正是我在找什么。 – FatboyJames

@FatboyJames很高兴听到这个消息。您可以将其标记为正确答案并投票。 – Thusitha

您可以添加逗号的数字是这样的：

var number = 1234567; 
 

 
document.querySelector('#money').innerHTML = number.toLocaleString();

$<span id="money"></span>

编辑

此外，为了确保数舍入到正确的小数位数，你可以这样做：

var number = 1234.5678; 
 

 
document.querySelector('#money').innerHTML = (+number.toFixed(2)).toLocaleString();

$<span id="money"></span>

在这种情况下，+符号类型转换舍入值回数字，然后将逗号相加。

来源

2017-09-20 18:50:53 Brian

如何格式化不断变化的跨度？

回答

相关问题