備忘録的プログラミングリファレンス

datalist タグエレメント

 datalist タグエレメントは、<input> エレメントの入力候補リスト(a list of predefined options)を定義するエレメントです。

 datalist タグエレメントで定義したデータ一覧は、datalist タグエレメントのID名と<input>エレメントのlist属性名でバインドできます。

<datalist> エレメント
<input list="test">

<datalist id="test">
	<option value="tokyo" />
	<option value="nagoya" />
	<option value="kyoto" />
	<option value="osaka" />
	<option value="fukuoka" />
</datalist>
表示例

詳しくは「動作の確認」を参照してください。

 データ一覧は<option>エレメントで定義します。

 <input>エレメントのオートコンプリート機能は、datalist タグエレメントで定義した値から候補が選択されます。

属性

グローバル属性も持ちます。以下に主な属性のみを示します。

AttributeValueExtra information
idcssにも使えます。エレメントをユニークとします。
classcssに使います。同名のclassは同じスタイルが適応されます。

動作の確認

JavaScript

 DOM でのインターフェイス定義は、HTMLDataListElement を参照してください。