htmlのinputに履歴でなく独自の値を候補として表示する:datalistとautocomplete="off"をうまく組み合わせる
html の input type="text" に datalist を使うときは、下のように option を設定します。
<input type="text" list="words" autocomplete="off">
<datalist id="words">
<option value="あ">
<option value="い">
</datalist>
ポイント:
- input の list に datalist の id 名をセットする
- datalist に option をいくつか入れる
- option の値は value にセットする
- autocomplete="off" で過去の履歴を表示しない
上のコードでは input にフォーカスを当てたときに、履歴でなく datalist で設定したものが候補として表示されます。