我有这个小提琴：
代码只是带有模式
的类型编号的输入字段pattern="[0-9]+(\.[0-9]+)?"
如果输入无效，CSS会添加红色边框：
input:invalid { border:1px solid red; }
但是，如果我输入1.3然后将字段标记出来，我会得到一个红色边框，即使根据模式这是正确的。这有什么不对？
PS：这是在野生动物园。
编辑：好的，我添加了步骤=＆＃34;任何＆＃34;这似乎解决了它。你们能证实吗？
答案 0 :(得分：8)
您已将输入定义为type=number。如本文所述，必须使用step属性明确允许浮点数才能正确验证。
https://blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrome/
在您的输入中添加一个步骤属性：step="any"：
<input type="number" name="quantity" class="form-control" placeholder="Quantity" tabindex="2" step="any">
此外，根据MDN pattern不适用于number类型：
当type属性的值为text时，此属性适用， 搜索，电话，网址或电子邮件;否则会被忽略