datalist 要素入力候補の選択肢を提供する
datalist 要素は閲覧者に入力候補の選択肢を提供します。入力候補は、内包する option 要素で提供することができます。この要素、および内包される要素は、画面上にレンダリングされません。
datalist 要素は、要素に付与された id 属性値と input 要素に付与された list 属性によって関連付けを行うことができます。関連づけられた input 要素において、datalist 要素はサジェストとして機能します。
対応するブラウザでは、入力欄で「↓」キーを押したり、入力欄をダブルクリックすると入力候補が表示されます。また、入力内容によってサジェスト機能のように働きます。
datalist 要素の仕様
- カテゴリ
- コンテンツモデル
-
- または 0個以上の option 要素、およびスクリプト支援要素のいずれか
- この要素を使用できる文脈
フレージング・コンテンツが期待される場所
- この要素で使用できる属性
datalist 要素のサンプルソース
<input list="arealist" tyle="text" name="area" value="" /> <datalist id="arealist"> <option value="東京都" /> <option value="埼玉県" /> <option value="群馬県" /> <option value="神奈川県" /> <option value="千葉県" /> </datalist>
主要ブラウザの対応
| IE11 | ○ |
|---|---|
| Edge（EdgeHTML） | ○ |
| Edge（Chromium） | ○ |
| Chrome | ○ |
| Firefox | ○ |
| Safari | ○ |
| iOS Safari | ○ |
| Android Chrome | ○ |