输入 + 数据列表，默认值，在 select 重置？

Question

我正在使用 <datalist> 来允许选择一个选项，但仍然允许输入值。这就是我的意思：

<input list="cities" name="city">
<datalist id="cities">
    <option value="Portland">
    <option value="San Francisco">
</datalist>

选择城市后，打开下拉列表只会显示该城市，除非我手动按退格键将其清除。我想我可以像这样用 jquery 来解决这个问题：

$('input[name=city]').click(function() {
  $('input[name=city]').empty();
});

这很好，但它不起作用。 I've seen in other examples how to remove a 'selected' flag (here also)，但我看不到它适用于 <datalist>。

这是一个 jsfiddle：https://jsfiddle.net/tedder/ekaLc64t/2/

Answer 1

我不确定这是否是您想要的，但请尝试将代码更改为：

  $('input[name=city]').focusin(function() {
    $('input[name=city]').val('');
  });
  $('#xx').click(function() {
    $('input[name=city]').val('');

  });

https://jsfiddle.net/ekaLc64t/9/

输入 + 数据列表，默认值，在 select 重置？

input + datalist, default value, reset on select?

html

jquery

html-datalist