Question

我试图让输入框显示带空格分隔符的数字。像这样： 20 000和200 000 000而不是20000和200 000

问题是我希望在你输入时发生这种情况。因此，当您在输入元素中键入数字时，我希望动态添加此间距。

有没有人有这方面的好解决方案？

我使用此功能在静态输出上执行此操作，但是当从文本框中获取值，通过该函数运行然后将其放回原因时，它无法正常工作。

function delimitNumber(number) {
    var delimiter = " "; 

    number = new String(number);
    var parts = number.split('.', 2);
    var decimal = parts[1];
    var i = parseInt(parts[0]);

    if(isNaN(i)) 
        return ''; 

    var minus = '';

    if (i < 0) 
        minus = '-'; 

    i = Math.abs(i);
    var n = new String(i);
    var a = [];

    while(n.length > 3) {
        var nn = n.substr(n.length-3);
        a.unshift(nn);
        n = n.substr(0,n.length-3);
    }

    if (n.length > 0) 
        a.unshift(n); 

    n = a.join(delimiter);

    if (typeof decimal === 'undefined' || decimal.length < 1)  
        number = n;
    else 
     number = n + '.' + decimal;

    number = minus + number; // Assemble the number with negative sign (empty if positive)
    return number;
}

Answer 1

<input type="text" id="number" />

JS：

$('#number').on("keyup", function() {
    this.value = this.value.replace(/ /g,"");
    this.value = this.value.replace(/\B(?=(\d{3})+(?!\d))/g, " ");
});

http://jsfiddle.net/LLcsxr6c/

我使用 keyup 事件，因为 keypress 或 keydown 将在输入框实际更新之前触发。

使用jQuery 2，您可以使用$('#number').on("input", function()

Answer 2

创建一个将为您执行字符串操作的函数。接下来，在输入框上设置一个侦听器以侦听键。该按键事件应触发您的函数，传递输入框的值，然后将值设置为新分隔的字符串。

在输入框中为数字添加空格分隔符

2 个答案: