jQuery 键入时在输入字段中为数字添加逗号
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9156390/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Add commas for a number in input field while typing
提问by Alex G
This does it incorrectly: Can jQuery add commas while user typing numbers?
这样做是错误的： 用户输入数字时 jQuery 可以添加逗号吗？
$('input.number').keypress(function(event){
if(event.which >= 37 && event.which <= 40){
event.preventDefault();
}
var $this = $(this);
var num = $this.val().replace(/,/g, '');
$this.val(num.replace(/(\d)(?=(\d{3})+(?!\d))/g, ","));
});
I need "1000000" to be "1,000,000" or better with spaces "1 000 000".
我需要“1000000”为“1,000,000”或更好的空格“1 000 000”。
Please help. Thanks.
请帮忙。谢谢。
采纳答案by XepterX
if you wanted to have something like "1 000 000", you can change the code to something like this.
如果你想要像“1 000 000”这样的东西，你可以把代码改成这样。
var num = $this.val().replace(/(\s)/g, '');
$this.val(num.replace(/(\d)(?=(\d{3})+(?!\d))/g, " "));
Hope this helps
希望这可以帮助
回答by CR41G14
$(document).ready(function(){
$('input.number').keyup(function(event){
// skip for arrow keys
if(event.which >= 37 && event.which <= 40){
event.preventDefault();
}
var $this = $(this);
var num = $this.val().replace(/,/gi, "").split("").reverse().join("");
var num2 = RemoveRougeChar(num.replace(/(.{3})/g,",").split("").reverse().join(""));
// the following line has been simplified. Revision history contains original.
$this.val(num2);});});
function RemoveRougeChar(convertString){
if(convertString.substring(0,1) == ","){
return convertString.substring(1, convertString.length)
}
return convertString;
}
Edit as you see fit - also in jsfiddle - jsFiddle
按照您认为合适的方式进行编辑 - 也在 jsfiddle 中 - jsFiddle
回答by Zero Distraction
You can use Digital Bush's Masked Input Plugin for Jquery. It has many options for customisation including spaces, eg:
您可以使用 Digital Bush 的Masked Input Plugin for Jquery。它有许多自定义选项，包括空格，例如：
$("#myInputText").mask("9 999 999",{placeholder:" "})
It seems to have been tested on different browser platforms so it could save you from some compatibility testing.
它似乎已经在不同的浏览器平台上进行了测试，因此它可以使您免于进行一些兼容性测试。
If you want a more comprehensive numeric mask support, you can use the excellent autoNumeric from decorplanit.com. Their webpage is full of examples.
如果您想要更全面的数字掩码支持，您可以使用来自decorplanit.com的优秀autoNumeric。他们的网页充满了例子。
回答by manroe
I tried autoNumericas @Zero-Distraction 's answer suggested, but I had some issues with cut/pasting into it. The CleaveJSlibrary has a lot more popularity, a little more built-in functionality, and I didn't have the same issues with it. (demo website at https://nosir.github.io/cleave.js/)
我按照@Zero-Distraction 的回答建议尝试了autoNumeric，但我在剪切/粘贴时遇到了一些问题。该CleaveJS图书馆有很多更多的人气，多一点内置的功能，我没有与它有同样的问题。（演示网站在https://nosir.github.io/cleave.js/）
回答by Luke
I tried to improve on j0k's code by instead using blur and focus events rather than keyup: http://jsfiddle.net/AqDda/
我试图通过使用模糊和焦点事件而不是 keyup 来改进 j0k 的代码：http: //jsfiddle.net/AqDda/
^ Try input A (standard type="number") versus input B (type="text" with JavaScript and some 'invalid' styling).
^ 尝试输入 A（标准类型=“数字”）与输入 B（使用 JavaScript 的类型=“文本”和一些“无效”样式）。
$('input.number').on("focus",function(e){
var $this = $(this);
var num = $this.val().replace(/,/g,"");
$this.val(num);
}).on("blur", function(e){
var $this = $(this);
var num = $this.val().replace(/[^0-9]+/g, '').replace(/,/gi, "").split("").reverse().join("");
var num2 = RemoveRougeChar(num.replace(/(.{3})/g,",").split("").reverse().join(""));
$this.val(num2);
});
