datalist 要素

概要

HTML Datalist 要素 (<datalist>) は、ユーザーに入力候補の選択肢を提供します。その候補となる値を持つ <option> 要素のセットをその子要素として内包します。

属性

この要素には、全ての要素が持つグローバル属性以外の属性はありません。

例

<label>Choose a browser from this list:
<input list="browsers" name="myBrowser" /></label>
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
</datalist>

input 要素がその list 属性によって、同じ値を id 属性に持つ datalist 要素に紐付けられています。

ライブ表示でその動作を確認してみてください。「半角の f」を入力してみると分かりやすいでしょう。

表示結果

結果を使用する

<input> 要素の name 属性でコントロールの名前を指定しており、これはフォームデータとともに送信されます。

このフォームデータはサーバ側で、HTTP リクエストから取得できます: String myBrowser = request.getParameter("myBrowser")

仕様

ブラウザ実装状況

関連情報

• <input> 要素、 及びその list 属性の詳細
• <option> 要素