Question

如何使用以下规则在HTML5中编写验证？

用户ID总长度应为 7个字符，包括字母和数字
用户ID 必须以字母 [ AZ / az ]开头，且 2 字符< / LI>
剩余5个字符应为数字 [0-9]

示例：

ab12345 ， xy56879 ， pm30075

HTML

<form action="" method="post">
  <div>
    <label for="userid">User ID:</label>
    <input type="text" name="userid" class="form-control" value="" required  pattern="[A-Za-z]{2}+[0-9]{5}" title="User ID" aria-required="true" placeholder="Eg: ab12345">
  </div>
  <br>
  <div>    
  <label for="email">Email Address:</label>
  <input type="text" name="email" value="" required  title="Email" aria-required="true" placeholder="hello.world@happyworld.com">
  </div>
  <button type="submit">Submit</button>
</form>

Answer 1

我希望以下模式可以做到

pattern="(?=.*[A-Za-z]{2})(?=.*[0-9]{5}).{7,7}"

<强> DEMO HERE

Answer 2

只需从您的模式中移除+：

＆＃13;

input:invalid { outline: 1px solid red }

＆＃13;

<input type="text" pattern="[A-Za-z]{2}[0-9]{5}" required="true" placeholder="Eg: ab12345">

＆＃13;

使用某些规则进行HTML5验证

2 个答案: