HTMLパターン属性
定義と使用法
この属性は、要素の値がチェックpatternされる正規表現を指定します。
<input>
注：このpattern属性は、テキスト、日付、検索、URL、電話、電子メール、およびパスワードの入力タイプで機能します。
ヒント：グローバルtitle属性を使用して、ユーザーを支援するパターンを記述します。
ヒント： JavaScriptチュートリアルで、正規表現の詳細を確認してください。
に適用されます
このpattern属性は、次の要素で使用できます。
| エレメント | 属性 |
|---|---|
| <入力> | パターン |
例
入力例
3文字のみ（数字や特殊文字を含まない）を含むことができる入力フィールドを持つHTMLフォーム：
<form action="/action_page.php">
Country code: <input type="text" name="country_code"
pattern="[A-Za-z]{3}" title="Three letter country code">
<input type="submit">
</form>
パスワードの例
6文字以上を含む必要があるtype = "password"の<input>要素：
<form action="/action_page.php">
Password: <input type="password" name="pw" pattern=".{6,}" title="Six or more characters">
<input type="submit">
</form>
パスワードの例
type = "password"の<input>要素には、少なくとも1つの数字と1つの大文字と小文字の8文字以上が含まれている必要があります。
<form action="/action_page.php">
Password: <input type="password" name="pw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain at least one number and one uppercase and lowercase letter, and at least 8 or more characters">
<input type="submit">
</form>
ブラウザのサポート
表の数字は、属性を完全にサポートする最初のブラウザーバージョンを示しています。
| Attribute | |||||
|---|---|---|---|---|---|
| pattern | 5.0 | 10.0 | 4.0 | Not supported | 9.6 |