数字输入框的逗号分隔步骤

Question

当用户输入数字时，我可以以千为增量指定“步长”。 但是，为什么我不能写“ 1,000”而不是“ 1000”，以使成千上万的逗号分隔出现增量？ 这个怎么做？

 <div class="input"><label for="salary">Salary</label> <input class='inp_cont' id="salary" name="salary" placeholder="Enter your salary" step="1000" min="0" required="" type="number"></div> 

Answer 1

如果您要坚持type="number" ，则无法完成此操作，因为：

• 根据Chrome的报告：

  该值必须与以下正则表达式匹配：-？（\\ d + | \\ d +。\\ d + |。\\ d +）（[eE] [-+]？\\ d +）？

• 如规范所述：

  值= 浮点数

单击上面的链接，可以看到规范根本没有提到逗号的使用。

---

如果要切换到type="text" ：

 document.getElementById('salary').addEventListener('input', event => event.target.value = (parseInt(event.target.value.replace(/[^\\d]+/gi, '')) || 0).toLocaleString('en-US') ); 

 <div class="input"> <label for="salary">Salary</label> <input class='inp_cont' id="salary" pattern="^[\\d,]+$" name="salary" placeholder="Enter your salary" required="" type="text"> </div>