HTML | Datalist



Тег datalist позволяет добавить к полю выпадающие подсказки без сторонних библиотек



  <input 

type="text"

list="country-value"

autocomplete="off"

>

<datalist id="country-value">

<option value="HTML">HTML</option>

<option value="JS">Javascript</option>

<option value="PHP">PHP</option>

</datalist>




Когда пользователь будет набирать текст в поле ввода, снизу будет появляться дропдаун с подсказками и пользователь сможет выбрать один из предложенных вариантов, не заканчивая ввод



Если autocomplete включен (по умолчанию включен), то к значениям, которые вы задали в теге datalist, будут добавляться значения, которые пользователь вводил в это поле ранее