为什么我不能在HTML5号码字段中输入500？

Question

我的HTML5号码字段一直出现奇怪的意外验证错误。这是我的HTML代码：

<input type="number" name="width" maxlength="5" placeholder="Width" value="733.95591182365" />&nbsp;Width<br />

当我输入500并提交表格时，我收到错误：“请输入有效值。两个最接近的有效值是499.95591182365和500.95591182365。”

我已经解决了这个问题。问题在于value="733.95591182365"。我已将PHP代码更改为将小数舍入为整数，以便只能将整数回显到数字字段中。现在我只在输入小数时才收到错误，这没关系。

Answer 1

使用step="any"

时，您需要将type="number"作为属性

<form>
  <input step="any" type="number" name="width" maxlength="5" placeholder="Width" value="733.95591182365" />
</form>

Answer 2

对于number inputs，

  

step scale factor为1. default step为1

然后，由于没有step属性，allowed value step为1×1 = 1：

  

  
1. 如果该属性不存在，那么allowed value step就是   default step乘以step scale factor。
  

step base将是733.95591182365：

  

  
1. 如果元素具有value内容属性，以及将algorithm to convert a string to a number应用于的内容   那么value内容属性的值不是错误   返回结果并中止这些步骤。
  

因此，

  

约束验证：当元素具有allowed value step时，以及将algorithm to convert a string to a number应用于元素给出的字符串的结果   value是一个数字，从step base中减去的数字不是allowed value step的整数倍，   元素是suffering from a step mismatch。

由于733.95591182365 - 500 = 233.95591182365不是1的倍数，因此违反了该约束。

如果您想要其他步骤，请指定step属性。如果您不想要任何步骤，请使用step = "any"。