html5 input 最小值,html5 新增属性：input 的 min 及 step

产品中需要针对物品设置价格，按照要求最低值是0.99元，控件上下箭头步进1元。

刚好 html5 中针对 number 类型的 input 新增了 min 和 step 两个属性，顾名思义一个是最小值另一个是步进值。按要求设置好后很顺利实现目标。

直到提交表单时，发现如果不是0.99结尾的整数都会被提示非法值，在网上搜了下看到几个例子和我司产品一样使用 bootstrap 架构，min 和 step 用法也相同，只是多了几个自定义的属性。当时自作聪明以为问题出在多出来的自定义属性上，调查了很久发现网上的例子应该加载了其他的 js 控件做了辅助验证，和我的问题并没有半毛钱的关系。直到查到 w3c 标准的定义，发现 step 并不只是控制控件的步进值，对最终的值也会产生约束。

Constraint validation: When the element has an allowed value step, and the result of applying the algorithm to convert a string to a number to the string given by the element's value is a number, and that number subtracted from the step base is not an integral multiple of the allowed value step, the element is suffering from a step mismatch.

此为具体校验规则，其中 step base 求值规则摘要如下

The step base is the value returned by the following algorithm:

If the element has a min content attribute, and the result of applying the algorithm to convert a string to a number to the value of the min content attribute is not an error, then return that result and abort these steps.

所以我定义了 min="0.99" step="1" 之后，校验规则就变成除以 step 取余然后减去 min 为 0 。

Otherwise, if the attribute's value is an ASCII case-insensitive match for the string "any", then there is no allowed value step.

参考 step 的说明，定义成 step="any" 就可以绕过 step 的检查，而且貌似默认的步进就是 1，成功达到目的。