HTML - datalist 要素

概要

名前
datalist
カテゴリー
  • Flow content
  • Phrasing content
配置できる場所
Phrasing content が期待される場所。
コンテンツモデル
Phrasing content。または 0 個以上の option 要素
説明
datalist 要素は、input 要素の部品にサジェスト機能を提供するために、その入力候補となる複数の option 要素を取りまとめる要素です。input 要素datalist 要素を関連付けるには、datalist 要素の id 属性の値を input 要素list 属性に指定します。datalist 要素に対応したブラウザでは、datalist 要素とその子要素は、サジェスト機能として使用されるとき以外は表示されません。
タグの省略
開始タグも終了タグも省略できません。
DOM Interface
HTMLDataListElement
仕様書
仕様書策定状況コメント
LS:現行の標準
REC:勧告
サポートブラウザ
ie
IE
edge
Edge
firefox
Firefox
chrome
Chrome
safari
Safari
opera
Opera
safari
iOS Safari
android
Android
1042012.19.512.2×
○:Support ×:Not Support ?:未定義 n:以降の Version で Support

属性

グローバル属性
すべての要素で共通に利用できるグローバル属性を指定できます。

サンプルコード

datalist 要素のサンプルコードは以下のとおりです。

<label for="myBrowser">一覧からブラウザを選択して下さい:</label>
<input list="browsers" id="myBrowser" name="myBrowser" />
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
  <option value="Microsoft Edge">
</datalist>
datalist 要素のサンプルコード

関連記事

Category:
プログラミング
公開日:
更新日:
Pageviews:
140
Shares:
0
Tag:
HTML