input type="tel"タグ

HTML5

input type="tel"は、電話番号入力欄を作成するタグです。

解説

input type="tel"を使うと、電話番号形式かチェックを行う入力欄を作成できます。

しかし、電話番号のフォーマットは一概に何が正しいのかは言えないため、デフォルト状態では通常のテキストボックスと同じように何でも入力できます。
入力チェックを指定したい場合はpattern属性でフォーマットを指定してください。

カテゴリー (自カテゴリ)	フロー・コンテンツフレージング・コンテンツインタラクティブ・コンテンツ
コンテキスト (親カテゴリ)	フレージング・コンテンツを許可する場所
コンテンツ・モデル (子カテゴリ)	なし

input（type="tel"）タグには以下の属性が指定できます。

【属性】
属性	説明
name	名前を指定する（submit時にこの名前で送信される）（例）name="tel01"
value	値を指定する（例）value="999-999-9999"
size	入力欄のサイズを文字数で指定する（例）size="10"
maxlength	入力可能最大文字数を指定する（例）maxlength="10" ※全角半角の区別をしない純粋な文字数です。
readonly	読み取り専用にする（例）readonly="readonly" 　※readonlyのみでもOKです。
required	必須入力であることを指定する（例）required="required" 　※requiredのみでもOKです。
pattern	入力パターンを正規表現で指定する（例）pattern="^[0-9\-]+$" 　※半角数値とハイフンのみOK。

その他のグローバル属性値については、グローバル属性をご覧ください。

<input type="tel" name="tel01" value="999-999-9999">

デフォルト状態だと特に入力チェックはかかりません。

<input type="tel" name="tel02" required="required">

未入力だと、送信時にチェックがかかります。

<input type="tel" name="tel03" pattern="^[0-9]+$">

半角数値以外の入力だと、送信時にチェックがかかります。

<input type="tel" name="tel04" pattern="^0\d{1,3}-\d{1,4}-\d{4}$">

市外局番（2～4桁）-市内局番（1～4桁）-電話番号（4桁）の場合OKとなります。