HTML5における<datalist>タグの使い方

<datalist>タグは、フォームの入力欄などで、入力候補となるデータを定義するものです。候補の項目は、<option>タグで定義します。<datalist>タグをサポートしているブラウザで閲覧すると、<option>タグで定義した値が入力候補として表示されます。今回はHTML5における<datalist>タグの使い方をご紹介します。

HTML5における<datalist>タグの使い方

<datalist>タグは、フォームの入力欄などで、入力候補となるデータを定義するものです。具体的な使用方法としては<datalist>要素に指定したid属性の値と、input要素のlist属性の値を関連づけて使用します。関連付けると、input要素の入力候補に<datalist>要素の項目が表示されるようになります。

input要素と併用した時のサンプルコードです。

このように表示されます。

スクリーンショット 2016-05-20 16.41.54


イベント

購読

平日・毎朝更新中