twitter-bootstrap - Bootstrap 编号验证

Question

我正在使用 Bootstrap，但验证有问题。我只需要输入正整数。
如何实现？

例如:

<div>                       
    <input type="number" id="replyNumber" data-bind="value:replyNumber" />
</div>

Answer 1

它不是特定于 Twitter Bootstrap 的，它是一个普通的 HTML5 组件，您可以使用 min 指定范围和 max属性(在您的情况下只有第一个属性)。例如:

<div>                       
    <input type="number" id="replyNumber" min="0" data-bind="value:replyNumber" />
</div>

我不确定控件是否默认只允许整数，但你可以指定 step属性:

<div>                       
    <input type="number" id="replyNumber" min="0" step="1" data-bind="value:replyNumber" />
</div>

现在只能使用大于(等于)零的数字，并且步长为 1，这意味着值是 0、1、2、3、4、...。

请注意 :并非所有浏览器都支持 HTML5 功能，因此如果您真的想使用约束，建议您使用某种 JavaScript 后备(在您的后端也是如此)。

有关支持它的浏览器列表，您可以查看 caniuse.com .