HTML <input> 标签pattern属性

• 

  <input>标签pattern属性定义和用法

  pattern属性指定一个正则表达式，检查<input>元素的值。
  注意：pattern属性使用以下输入类型：text，date，search，url，tel，email和password。
  提示：使用全局title属性来描述帮助用户的输入模式。
  提示：在JavaScript教程中了解有关正则表达式的更多信息。

• 

  <input>标签pattern属性浏览器支持

  Edge/IE	Chrome	FireFox	Safari	Opera
  10.0（含）以上	5.0（含）以上	4.0（含）以上	10.1（含）以上	9.6（含）以上

• 

  HTML4.01和HTML5之间的差异

  pattern属性是HTML5的新功能。

• 

  <input>标签pattern属性语法

  <input pattern="regexp">

• 

  <input>标签pattern属性实例

  只能包含三个字母（无数字或特殊字符）:

  <form action="/jc_script/action.php">
    国家代码： <input type="text" name="country_code" pattern="[A-Za-z]{3}" title="三个字母的国家代码">
    <input type="submit">
  </form>
  

  尝试一下

  密码至少包含六个字符：

  <form action="/jc_script/action.php">
    密码: <input type="password" name="pw" pattern=".{6,}" title="六个或更多字符">
    <input type="submit">
  </form>
  

  尝试一下

  密码至少包含8个字符且包含数字小写字母大写字母：

  <form action="/jc_script/action.php">
    密码: <input type="password" name="pw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="必须包含至少一个数字和一个大写和小写字母，以及至少8个或更多字符">
    <input type="submit">
  </form>
  

  尝试一下
• 

  <input>标签pattern属性值

  属性值	描述
  regexp	指定检查<input>元素的值的正则表达式