HTML5データリスト要素の使用方法

序章

<datalist>要素を使用して、テキスト入力を少し増やすことができます。 <input>と<select>のブレンドに少し似ています。 この記事では、その使用方法について概説します。

前提条件

• HTML5の一般的な知識。 HTML5マークアップ言語の包括的なレビューについては、シリーズ「HTMLでWebサイトを構築する方法」を参照してください。

<datalist>要素の使用

HTML5マークアップで<datalist>要素を使用する方法は次のとおりです。

<label for="favorite-band">Your favorite band?</label>
<input list="fish"
name="fish-choice" id="fish-choice>" />

<datalist id="fish">
    <option value="Shark">
    <option value="Tuna">
    <option value="Ulua">
</datalist>

結論

<datalist>要素は、HTMLの便利な機能です。

HTML5マークアップ言語のより包括的なレビューについては、シリーズ「HTMLでWebサイトを構築する方法」を参照してください。