datalist要素

datalist要素はHTML5から新たに追加された要素です。

他のフォームコントロールのために予め用意された値の候補となるoption要素のセットを表します。

単一行テキストフィールドのinput要素のlist属性でdatalist要素のid属性を指定することで、入力値のサジェストをすることができます。

使用例

<label>キーワードを入力してください <input type="search" name="q" list="keywords"></label>



<datalist id="keywords">

<option>hoge</option>

<option>fuga</option>

<option>piyo</option>

<option>ponyo</option>

</datalist>

使用可能な属性

• すべてのグローバル属性

コンテンツカテゴリ

• フローコンテンツ
• フレージングコンテンツ

子要素にしていい要素の種類

• 0個以上のoption要素
• フレージングコンテンツ
  • ただし0個以上のoption要素をもつ場合

親要素にしていい要素の種類

• フレージングコンテンツが期待されているすべての要素

仕様書と策定状況