有没有办法为 HTML 输入范围类型添加千位分隔符？

Question

我想为显示的输出添加使用英语约定的千位分隔符。

<input id="number692" oninput="outputnumber692.value=number692.value" type="range" lang="en-150" name="number-692" value="110" min="500" max="200000"><output name="number-692" id="outputnumber692" for="number692">110</output>

我已阅读有关 lang="en-150" 属性的信息，但它不起作用。使用 JS 我只设法使用 onChange 事件更改值，但它不会触发动态地。

JSFiddle link

Answer 1

尝试以下操作：

<input id="number692" oninput="outputnumber692.value=Number(number692.value).toLocaleString()" type="range" lang="en-150" name="number-692" value="110" min="500" max="200000">
<output name="number-692" id="outputnumber692" for="number692">110</output>

有关详细信息，请参阅 toLocaleString。

Answer 2

您可以将此其他问题的答案应用于您的问题：
Add a thousands separator to a total with Javascript or jQuery?

// Using function from here: 
function addCommas(nStr) {
    nStr += '';
    var x = nStr.split('.');
    var x1 = x[0];
    var x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '' + ',' + '');
    }
    return x1 + x2;
}

<input id="number692" oninput="outputnumber692.value=addCommas(number692.value)" type="range" lang="en-150" name="number-692" value="110" min="500" max="200000">
<output name="number-692" id="outputnumber692" for="number692">110</output>

或者，正如您所说的 en-150，您也可以使用 .toLocaleString('en-150'):
（但这不是昏迷）

<input id="number692" oninput="outputnumber692.value=(+number692.value).toLocaleString('en-150')" type="range" lang="en-150" name="number-692" value="110" min="500" max="200000">
<output name="number-692" id="outputnumber692" for="number692">110</output>

希望对您有所帮助。

有没有办法为 HTML 输入范围类型添加千位分隔符？

Is there a way to add thousands separators for HTML input range type?

html

javascript

numbers

separator

output