属性値
属性名 | 説明 |
---|---|
tel | 電話番号を入力する |
メールアドレスの入力欄を作成 | |
url | URLの入力欄を作成 |
内容詳細
type属性に応じて、電話番号/メールアドレス/URLの入力欄を出力します。それぞれ環境に依存しますが、入力欄に応じた検証機能も実装されます。
- メールアドレス入力欄では、正しいメールアドレスであるかチェック(Operaのみ)
- URL入力欄では、正しいURLであるか(Firefox/Chrome/Operaのみ)
それぞれの入力欄の見た目は、type属性の値がtextの場合と変わりません。
iPhone/iPadでは、type属性がtel/email/urlの場合には入力時にそれぞれの値の入力に適したキーボードが既定で表示されます。
書式
<input type="tel"> <input type="email"> <input type="url">
サポートブラウザー
属性名 | |||||
---|---|---|---|---|---|
tel | X | X | X | O | X |
5.0 | 10.0 | 4.0 | 5.0 | 10.1 | |
url | O | 10.0 | O | O | 10.1 |
サンプル
ソースコード
<form id="myform" name="myform" style="background-color: #f1f1f1; border: 1px solid #d4d4d4;" action=""> <p>電話番号 : <input type="tel" name="tel"></p> <p>メールアドレス : <input type="mail" name="mail"></p> <p>url : <input type="url" name="url"></p> <p><input type="submit" value="送信"></p> </form>