HTML5 输入 - 具有 required="true" 属性的模式仍然允许表单提交答案

【问题标题】：HTML5 input - pattern with required="true" attribute still allows form submissionHTML5 输入 - 具有 required="true" 属性的模式仍然允许表单提交
【发布时间】：2017-02-27 07:10:06
【问题描述】：

我有如下文本框

<input type="text" name="country_code" pattern="[A-Za-z0-9|]{1,50}" title="Three letter country code" required="true">

当我提交表单而不在文本框中输入任何值时，会提交空字符串 ""。我希望 required="true" 能抓住它并抛出错误。我认为 required 和 pattern 属性的组合导致它的行为错误。

任何想法

【问题讨论】：

标签： html html-input

【解决方案1】：

您的语法错误。只需要required。

<input type="text" name="country_code" pattern="[A-Za-z0-9|]{1,50}" title="Three letter country code" required>

实际上是required="required"，但您可以省略第二个并使用简写代替。

【讨论】：

【解决方案2】：

请使用 required="required" 而不是 required="true"

<input type="text" name="country_code" pattern="[A-Za-z0-9|]{1,50}" title="Three letter country code" required="required">

【讨论】：

【解决方案3】：

只需在需要的末尾添加“/”

<input type="text" name="country_code" pattern="[A-Za-z0-9|]{1,50}" title="Three letter country code" required />

【讨论】：