获取datalist选中value值

要获取datalist选中的value值，可以通过以下几个步骤来实现：

1. 首先，给datalist绑定一个change事件，当用户选择某个选项时，触发该事件。
2. 在change事件的处理函数中，使用JavaScript获取datalist选中的value值。
3. 首先，通过document.querySelector()方法获取datalist的引用，可以使用CSS选择器来获取。
4. 然后，使用datalist.options属性获取datalist中的所有选项。
5. 遍历datalist.options，判断每个选项的selected属性是否为true，如果是则表示该选项被用户选择了。
6. 找到被选择的选项后，可以通过选项的value属性获取它的值。

下面是一个简单的示例代码：

HTML部分：

<input list="myDatalist" id="myInput">
<datalist id="myDatalist">
  <option value="1">选项1</option>
  <option value="2">选项2</option>
  <option value="3">选项3</option>
</datalist>
<button onclick="getValue()">获取选中值</button>

JavaScript部分：

function getValue() {
  var input = document.getElementById('myInput');
  var datalist = document.querySelector('#myDatalist');
  var options = datalist.options;
  
  for (var i = 0; i < options.length; i++) {
    if (options[i].selected) {
      var selectedValue = options[i].value;
      console.log(selectedValue);
      break;
    }
  }
}

以上代码实现了获取datalist选中value值的功能。当用户选择某个选项后，点击获取选中值按钮，就会在控制台输出选中的value值。需要注意的是，datalist中的选项需要使用<option>标签来定义，同时需要给<input>元素设置list属性与datalist的id相对应。