内联功能将输入限制为具有多达2个小数位置的数字



我目前有一个输入我仅限于编号输入的输入,它不允许整个数字以外的任何字符的输入:

<input class="quantity" type="text" onkeypress="return (event.charCode == 8 || event.charCode == 0 || event.charCode == 13) ? null : event.charCode >= 48 && event.charCode <= 57">

我想修改此onkeyup代码,以便它还允许一个数字,最多可容纳2个小数位。是否可以直接在Inline onkeyup函数中进行操作,还是我需要在输入之外创建一个函数并调用它?我发现了一些类似的问题,但是它们主要与验证事实后验证输入有关,而我想限制人们甚至输入没有1或2个小数位置的整数或数字的东西。

不幸的是,这里也不是HTML5模式,因为我必须支持不支持此的浏览器。

onkeyup事件在按下键并将值添加到输入后,因此您必须在价值更改之前限制用户。

使用type="number"用户无法输入十进制数字以外的任何字符;通过使用minmax属性,浏览器将将输入标记为invalid,但这并不限制用户输入大于最大值的值。

在下面的示例中,我使用onkeypress event侦听器在输入更改之前检查输入的值,然后检查当前值和新输入值的总和,以确保其小于100比99。

<input type="number" onkeypress="return (this.value + String.fromCharCode(event.which) > 99) ? false : true;" min="0" max="99">

链接到实时示例: JSFIDDLE

最新更新