HTML | 電話番号入力フォームパーツのサンプルコード
電話番号入力フォームパーツのHTMLサンプルコードと表示例の紹介になります。
電話番号入力フォームパーツのサンプルコード
HTMLで電話番号を入力するフォームパーツを設置する際のサンプルコードです。
「type」属性にて電話番号とする「tel」を指定しています。
「autocomplete」にて「tel」を指定、履歴からの予測入力を許可します。
「type」属性を「tel」にしても電話番号以外も入力できてしまいますし、入力される書式や桁数などを判定または制限しない事に注意が必要です。
また、国際電話番号に対応するには、別途処理の追加が必要です。
「pattern」属性で細かく書式を指定する事も可能ですが、国によって書式が違い、個人によってもハイフンの入れる場所は違うのが難しい部分です。
<p>電話番号<p>
<p><input type="tel" name="phone_number" value="" autocomplete="tel"></p>以下は上記フォームのHTMLを実際に設置した結果になります。
スタイル・デザインは変更を加えていないため、サイトの設定が反映されています。
電話番号