datalist 要素

概要

HTML の Datalist 要素（<datalist>）は、ユーザーに入力候補の選択肢を提供します。その候補となる値を持つ <option> 要素のセットをその子要素として内包します。

• コンテンツカテゴリ フローコンテンツ、フレージングコンテンツ
• 許可された内容 Either フレージングコンテンツ、または 0 個以上の <option> 要素。
• タグの省略 不可。開始と終了タグの両方が必要。
• 許可された親要素 フレージングコンテンツを受け入れるすべての要素
• DOM インターフェイス HTMLDataListElement

属性

この要素には、全ての要素が持つグローバル属性以外の属性はありません。

例

<input list="browsers" />

<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
</datalist>

input 要素がその list 属性によって、同じ値を id 属性に持つ datalist 要素に紐付けられています。

ライブ表示でその動作を確認してみてください。「半角の f」を入力してみると分かりやすいでしょう。

実際の表示を確認

この例は Firefox では以下の様に表示されるでしょう。

仕様

互換性

関連情報

• <input> 要素、 及びその list 属性の詳細
• <option> 要素