datelistについて

■ datalistとは入力候補となるデータリストを定義する時に利用する。

タグは、フォームの入力欄などで入力候補となるデータリストを定義します。各データのリスト項目は、

■ どんな時に利用するの？ datalistを利用してオートコンプリート機能などを実装したい時に利用。

オートコンプリート機能とは、Webページで入力した内容を次回入力時に補完してくれる機能のことです

■ selectとの違いは？ selectタグは選択型で便利ですが、一方で選択肢にない答えは入力できません。

datalistはinputも出来ます。 select + input = datalistのようなイメージかな。

■ 使い方

<input type="text" size="20" list="mylist1" />
<datalist id="mylist1">
<option>りんご</option>
<option>バナナ</option>
<option>ぶどう</option>
</datalist>

技術ブログ