javascript - JS:获取所选数据列表选项的.html()

我有以下代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!-- add jquery -->

CITY<br>
<input id='cities' type="text" list="list_items">
<datalist id="list_items">
  <option value='Kent'>WA</option> <!-- PLEASE NOTE THAT THERE ARE REPEATING CITY NAMES -->
  <option value='Kent'>DE</option>
  <option value='New York City'>NY</option> <!-- AND REPEATING STATE NAMES -->
  <option value='Liverpool'>NY</option>
  <option value='Brentford'>SD</option>
</datalist>
<br><br>

STATE<br>
<input id='states' type="text" disabled>

<script>
  $('#cities').on('change', function(val) {
    $('#states').val(val.html())
  })
</script>

https://jsfiddle.net/pxcc1vn4/3/

我正在尝试使其能够从datalist中选择一项，并使所选datalist option的值位于第一个input中，并使所选.html()的datalist option放在第二个input中。

最佳答案

这将达到目的。

$('#cities').on('change', function() {
    $('#states').val($(this).text())
})

http://api.jquery.com/html/
与
http://api.jquery.com/val/

关于javascript - JS:获取所选数据列表选项的.html()，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41929937/