HTML <input>パターン属性
例
3文字のみ（数字や特殊文字は不可）を含むことができる入力フィールドを持つHTMLフォーム：
<form action="/action_page.php">
<label for="country_code">Country code:</label>
<input
type="text" id="country_code" name="country_code"
pattern="[A-Za-z]{3}"
title="Three letter country code"><br><br>
<input type="submit">
</form>
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
この属性は、フォームの送信時に要素の値がチェックpatternされる正規表現を指定します。
<input>
注：このpattern属性は、テキスト、日付、検索、URL、電話、電子メール、およびパスワードの入力タイプで機能します。
ヒント：グローバルtitle属性を使用して、ユーザーを支援するパターンを記述します。
ヒント： JavaScriptチュートリアルで、正規表現の詳細を確認してください。
ブラウザのサポート
表の数字は、属性を完全にサポートする最初のブラウザーバージョンを示しています。
| Attribute | |||||
|---|---|---|---|---|---|
| pattern | 5.0 | 10.0 | 4.0 | 10.1 | 9.6 |
構文
<input pattern="regexp">
属性値
| Value | Description |
|---|---|
| regexp | Specifies a regular expression that the <input> element's value is checked against |
その他の例
例
8文字以上を含む必要があるtype = "password"の<input>要素：
<form action="/action_page.php">
<label for="pwd">Password:</label>
<input type="password" id="pwd"
name="pwd"
pattern=".{8,}" title="Eight or more characters">
<input type="submit">
</form>
例
type = "password"の<input>要素には、少なくとも1つの数字と1つの大文字と小文字の8文字以上が含まれている必要があります。
<form action="/action_page.php">
<label for="pwd">Password:</label>
<input type="password" id="pwd" name="pwd"
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>
例
type = "email"の<input>要素は、文字@文字の順序である必要があります。ドメイン（文字の後に@記号が続き、さらに文字が続き、その後に「。」が続く
後に "。" 署名し、aからzまで少なくとも2文字を追加します。
<form action="/action_page.php">
<label
for="email">Email:</label>
<input type="email" id="email" name="email"
pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$">
<input type="submit">
</form>
例
次の文字を含めることができないtype = "search"の<input>要素： 'または "
<form action="/action_page.php">
<label
for="search">Search:</label>
<input type="search" id="search" name="search"
pattern="[^'\x22]+" title="Invalid input">
<input type="submit">
</form>
例
type = "url"の<input>要素。http：//またはhttps：//で始まり、その後に少なくとも1文字が続く必要があります。
<form action="/action_page.php">
<label
for="website">Homepage:</label>
<input type="url" id="website"
name="website"
pattern="https?://.+" title="Include http://">
<input type="submit">
</form>
❮HTML<input>タグ