javascript - 无法从下拉数据列表 JS/HTML 获取值

Question

我有一个基本的下拉列表，但当我选择它时我无法控制该值(显示未定义)

尝试过.value、.text、.val()，但它们不起作用。我在网上搜索过，但似乎找不到解决方案。

这是它的 HTML。

<datalist id="browsers">
          <option value="Pacients"></option>
          <option value="Doctor"></option>
</datalist>

我尝试过的JS代码

console.log(document.getElementById('browsers').text);
console.log(document.getElementById('browsers').value);
console.log(document.getElementById('browsers').val());

选择后，我希望“Pacients”或“Doctor”登录到控制台，但给我的结果是未定义或 .val() 错误

Answer 1

如果您想要下拉菜单，请使用 <select>而不是<datalist>

<datalist>的目的用作自动完成建议列表 <input> 。请参阅https://www.w3schools.com/tags/tag_datalist.asp