【HTML】datalistタグ - データの選択

【HTML】datalistタグ - データの選択

HTMLのdatalistタグをご紹介します。

datalistタグ

datalistタグは入力項目の選択肢定義をマークアップします。

基本構文

<datalist id=”ID”>
    <option>データ</option>
    <option>データ</option>
    <option>データ</option>
</datalist>

サンプルコード

<label>果物を入力してください。<label><br>
<input type="text" list="input-text-list">
<datalist id="input-text-list">
    <option>リンゴ</option>
    <option>パイナップル</option>
    <option>ブドウ</option>
</datalist>