HTML リファレンスマニュアル

HTML タグ完全ガイド

HTML: <input> pattern 属性

この記事では、HTML input pattern 属性の使用方法、オンラインの例、ブラウザの互換性、文法的定義、属性値の詳細情報などを紹介します。

オンラインサンプル

HTMLフォームで、入力フィールドは3文字（数字や特殊文字を含まない）のみを含むことができます：

例

!DOCTYPE　html>
<html>
<head>
<title>HTML:<input>　pattern　属性　-　基本チュートリアルサイト(oldtoolbag.com)</title>
<body>
<form　action="action_page.php">
　　国/地域コード:　<input　type="text"　name="country_code"　pattern="[A-Za-z]{3"　title="3アルファベットで国名/地域コード">
　　<input　type="submit">
</form>
</html>

テストをしてみる‹/›

ブラウザの互換性

IEファイアフォックスオペラクロームサファリ

インターネット・エクスプローラー 10、Firefox、Opera そして Chrome が pattern 属性をサポートしています。

注意：Safari または Internet Explorer 9 及びそれ以前のバージョンでは、<input> タグの pattern 属性をサポートしていません。

定義と使用法

pattern 属性は正規表現を指定し、フォームの提出時に <input> 元素の値をチェックします。

注意：pattern 属性は以下の input タイプに適用されます：text、search、url、tel、email そして password。

ヒント：グローバルの title 属性を使用してユーザーにパターンを説明します。

ヒント：JavaScript 教程でさらに詳しく学ぶことができます。正規表現の知識が必要です。

HTML 4.01 と HTML5の間の違い

pattern 属性は HTML5 の新しい属性が追加されました。

構文

<input pattern="regexp">

属性値

値	説明
regexp	<input> 元素の値のバリデーションに使用される正規表現を定義します。

　HTML <input> タグ

HTML: <template> タグ