数字作为spinboxes（Numbers as spinboxes）

另一个承担验证输入从你的用户,是使用数值属性。有许多情况下,您可能需要用户选择一个号码,即使它看起来很直接的不是。看看是这样说的:如果我问你选一个数字,你将会说5。但我的意思是说一个数字从1到10。你可以选择3.75吗?我想说你真会争辩的你应该知道我的意思是一个整数。正如你可以看到许多不仅仅是一个数字,通常你有一些隐含的边界。


这是什么使数值属性所以特别- - -事实在于,你可以控制范围的数据用户可以选择,强迫选择只有整数和步骤比例因子设置为默认为1。当你使用元素数量显示作为一个spinbox。

让我们看一下最简单的方式来使用该号码输入类型——尽可能最小的值是默认1,步骤比例因子为1,没有最大限制- - -按“试试这个例子”按钮来看看它看起来像:

<form><input type="number" required><input type="submit" value="Submit Now!"></form>

现在,让我们说你想限制用户的选择一个范围的10到20。然后我们必须使用min(指定的最低可接受值为这个字段)和马克斯(指定可接受的最大价值为这个字段)属性,和它看起来像这样:

<form><input type="number" min="10" max="20" required><input type="submit" value="Submit Now!"></form>

我说你可以控制步骤规模和这样做是通过步属性。此外,你可以预定一个号码,也许你有一个点子,这是最常见的数量和这样你让它更快的为用户填写表单。在接下来的例子中,我设置了一步扩展到2和预设值是16 -这是它是什么样子:

<form><input type="number" min="10" max="20" step="2" value="16" required><input type="submit" value="Submit Now!"></form>

如果你试图超出指定范围一些浏览器将灰色出箭而其他人就不会允许你去任何进一步的。