如何將千位分隔符添加到我的 html 表單中
[英]How do I add Thousands separator to my html form
問題描述
例如，我有一個文本框，我輸入 12000 並且我希望它在文本框中看起來像 12,000 我該怎么做？ 我使用 html 來做文本框
8 個解決方案
解決方案1
10 2012-03-19 16:18:10
嘗試一些像這樣
function addCommas(nStr)
{
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}
然后在你的文本框上使用它
<input type="text" id="txtBox" onchange="return addCommas(this.value)" />
希望有所幫助
解決方案2
7 2014-02-25 15:41:32
使用jQuery autoNumeric插件 ：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Input with separator</title>
<script type="text/javascript" src="jquery-1.11.0.js"></script>
<script type="text/javascript" src="autoNumeric.js"></script>
<script type="text/javascript">
$( document ).ready( function() {
$("#myinput").autoNumeric(
'init', {aSep: ',', mDec: '0', vMax: '99999999999999999999999999'}
);
});
</script>
</head>
<body>
<input id="myinput" name="myinput" type="text" />
</body>
</html>
解決方案3
3 已采納 2012-03-19 16:52:04
這可能是一個壞主意......
<!doctype html>
<html lang="en">
<head>
<meta charset= "utf-8">
<title>Comma Thousands Input</title>
<style>
label, input, button{font-size:1.25em}
</style>
<script>
// insert commas as thousands separators
function addCommas(n){
var rx= /(\d+)(\d{3})/;
return String(n).replace(/^\d+/, function(w){
while(rx.test(w)){
w= w.replace(rx, '$1,$2');
}
return w;
});
}
// return integers and decimal numbers from input
// optionally truncates decimals- does not 'round' input
function validDigits(n, dec){
n= n.replace(/[^\d\.]+/g, '');
var ax1= n.indexOf('.'), ax2= -1;
if(ax1!= -1){
++ax1;
ax2= n.indexOf('.', ax1);
if(ax2> ax1) n= n.substring(0, ax2);
if(typeof dec=== 'number') n= n.substring(0, ax1+dec);
}
return n;
}
window.onload= function(){
var n1= document.getElementById('number1'),
n2= document.getElementById('number2');
n1.value=n2.value='';
n1.onkeyup= n1.onchange=n2.onkeyup=n2.onchange= function(e){
e=e|| window.event;
var who=e.target || e.srcElement,temp;
if(who.id==='number2') temp= validDigits(who.value,2);
else temp= validDigits(who.value);
who.value= addCommas(temp);
}
n1.onblur= n2.onblur= function(){
var temp=parseFloat(validDigits(n1.value)),
temp2=parseFloat(validDigits(n2.value));
if(temp)n1.value=addCommas(temp);
if(temp2)n2.value=addCommas(temp2.toFixed(2));
}
}
</script>
</head>
<body>
<h1>Input Thousands Commas</h1>
<div>
<p>
<label> Any number <input id="number1" value=""></label>
<label>2 decimal places <input id="number2" value=""></label>
</p></div>
</body>
</html>
解決方案4
2 2012-03-19 16:13:54
您可以使用Javascript Mask API
解決方案5
2 2012-03-19 16:14:01
對於用戶輸入，我建議不要格式化值以包含逗號。 一旦提交，處理整數值（12000）將比處理字符串值（12,000）容易得多。
但是，如果您確定要格式化值，那么正如@achusonline建議的那樣，我會屏蔽該值。 這是一個jQuery插件，可以獲得這個結果：
解決方案6
0 2019-05-18 15:57:41
你可以嘗試這個簡單的Javascript
<script type="text/javascript">
function addcommas(x) {
//remove commas
retVal = x ? parseFloat(x.replace(/,/g, '')) : 0;
//apply formatting
return retVal.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
</script>
HTML代碼
<div class="form-group">
<label>Amount </label>
<input type="text" name="amount" onkeyup="this.value=addcommas(this.value);"class="form-control" required="">
</div>
解決方案7
0 2021-12-06 06:41:38
如果您只想使用分隔符在 html 中顯示數字，您可以使用 html 中的數字格式管道。
所以如果你有數字 123456，你可以簡單地用 HTML 寫
<span> {{123456 | number}} </span>
就是這樣
解決方案8
0 2021-12-06 07:35:59
在輸入更改時添加標點符號或數字逗號。
html代碼
<input type="text" onkeyup="this.value=addPunctuationToNumbers(this.value)">
Javascript代碼
<script>
function addPunctuationToNumbers(number) {
return number.replace(/(\d{3})(?=\d)/g, "$1,");
}
</script>
<!DOCTYPE html> <html> <body> <h1>On change add pumctuation to numbers</h1> <input type="text" onkeyup="this.value=addPunctuationToNumbers(this.value)"> <script> function addPunctuationToNumbers(number) { return number.replace(/(\\d{3})(?=\\d)/g, "$1,"); } </script> </body> </html>
如何確定瀏覽器中當前語言環境的小數和千位分隔符？
[英]How do I determine the decimal and thousands separator for the current locale in the browser?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.