本机强制输入数字小数位答案

【问题标题】：Force input number decimal places natively本机强制输入数字小数位
【发布时间】：2016-12-22 16:24:53
【问题描述】：

我想强制 <input type="number" step="0.01" /> 始终使用 2 位小数来输入会计数据。

我已经设法使用 JavaScript 做到了

document.getElementById('input').addEventListener('change', force2decimals);

function force2decimals(event) {
	event.target.value = Number(Math.round(event.target.value * 100) / 100).toFixed(2);
}

&lt;input type="number" step="0.01" id="input" value="1.00" /&gt;

有什么办法可以原生处理吗？

我知道step 属性，“重复答案”没有回答我的问题。

【问题讨论】：

使用input事件...
看看pattern属性，比如pattern="\d+\.\d\d"。
很遗憾，pattern 属性不适用于number 类型的输入

标签： javascript html

【解决方案1】：

可以这样做：

document.getElementById('input').addEventListener('change', force2decimals);

function force2decimals(event) {
	event.target.value = parseFloat(event.target.value).toFixed(2);
}

&lt;input type="number" step="0.01" id="input" value="1.00" /&gt;

没有办法在 HTML5 中“本地”执行此操作。

【讨论】：

不需要检查值的长度，它会自动格式化 val = parseFloat(event.target.value).toFixed(2);
@ShafiqulIslam，是的。我的第一个答案是一行。但是，当我们有一个像 1.10 这样的数字时，它会将其转换为 1.1 。因此，我编写了额外的代码以始终保持 2 位小数
@ShafiqulIslam，我回复了答案，它工作正常:)
难道没有HTML的方式吗？
@YannBertrand，没有。 HTML 充当数学视图。您想担任会计师。所以，你必须手动完成。这就是我推荐的方式

【解决方案2】：

你可以使用这个：

function force2decimals(event) {
  var value = $(event).val();
  var format_val = parseFloat(value).toFixed(2);
  $(event).val(format_val);
}

&lt;input type="number" step="0.01" id="input" onchange="force2decimals(this)" value="1.00" /&gt;

我希望这会有所帮助。

【讨论】：

该问题没有 jQuery 标签。这意味着他希望通过 JavaScript 获得它。不是 jQuery
在这个问题中，使用 jQuery 没有任何限制，所以为什么我们不使用 jQuery，如果它很容易并且在这个问题中没有 jQuery 标签可以，但是如果问题提供者错过标签，那么我们可以不使用相关的东西回答？
@ShafiqulIslam 是的，这是当前的协议。如果用户尚未应用 jQuery 标签，并且您想提供 jQuery 解决方案，请先在评论中询问 OP 是否适合使用 jQuery。
@torazaburo 好的，我会的。
@ShafiqulIslam，有时 jQuery 让事情变得简单。但是，许多开发人员更喜欢使用原生 JS 语法而不使用 jQuery。这取决于您的项目、期望和限制。因此，当有人在他/她的项目中使用原生 JavaScript 时，我们应该尝试在未充分使用的方式上解决他/她的问题。