javascript - 仅使用 Javascript 将数字格式化为千

Question

Console.log 显示正确的结果，但如何在键入时向输入类型添加相同的格式。

输入类型在每个逗号后重置为零。

1000 到 1,000

请帮忙。

此代码正在运行 here

function numberWithCommas(number) {
    if (isNaN(number)) {
        return '';
    }

    var asString = '' + Math.abs(number),
        numberOfUpToThreeCharSubstrings = Math.ceil(asString.length / 3),
        startingLength = asString.length % 3,
        substrings = [],
        isNegative = (number < 0),
        formattedNumber,
        i;

    if (startingLength > 0) {
        substrings.push(asString.substring(0, startingLength));
    }

    for (i=startingLength; i < asString.length; i += 3) {
        substrings.push(asString.substr(i, 3));
    }

    formattedNumber = substrings.join(',');

    if (isNegative) {
        formattedNumber = '-' + formattedNumber;
    }

    document.getElementById('test').value = formattedNumber;
}

<input type="number" id="test" class="test" onkeypress="numberWithCommas(this.value)">

Answer 1

一些注意事项:

• 因为你想要逗号，所以类型不是数字，而是字符串
• 因为您想在键入后处理输入，所以它是 onkeyup 而不是 onkeypressed

我有一个解决方案，可以使用正则表达式将 3 个字符替换为 3 个字符加一个逗号:

var x = "1234567";
x.replace(/.../g, function(e) { return e + ","; } );
// Gives: 123,456,7

即几乎是正确的答案，但逗号不在正确的位置。因此，让我们使用 String.prototype.reverse() 函数来修复它:

String.prototype.reverse = function() {
    return this.split("").reverse().join("");
}

function reformatText() {
    var x = document.getElementById('test').value;
    x = x.replace(/,/g, ""); // Strip out all commas
    x = x.reverse();
    x = x.replace(/.../g, function(e) { return e + ","; } ); // Insert new commas
    x = x.reverse();
    x = x.replace(/^,/, ""); // Remove leading comma
    document.getElementById('test').value = x;
}

<input id="test" class="test" onkeyup="reformatText()">