Javascript 使用html5数据列表自定义自动完成

Javascript 使用html5数据列表自定义自动完成,javascript,jquery,html,html-datalist,Javascript,Jquery,Html,Html Datalist,我正在使用html数据列表来自动填充一些数据。我想要一个行为,它应该过滤除一个默认值以外的所有内容。下面是示例代码: <input type="text" list="mylist"/> <datalist id="mylist"> <option value="San Jose"></option> <option value="San Francisco"></option> <option

我正在使用html数据列表来自动填充一些数据。我想要一个行为,它应该过滤除一个默认值以外的所有内容。下面是示例代码:

<input type="text" list="mylist"/>
<datalist id="mylist">
    <option value="San Jose"></option>
    <option value="San Francisco"></option>
    <option value="New York"></option>
    <option value="Chicago"></option>
    <option value="Boston"></option>
    <option value="Los Angeles"></option>
</datalist>

在上述情况下,默认情况下,如果我输入S,它只显示SAN若泽和旧金山,当我输入N时,它只显示纽约。 我的要求是,在任何情况下,无论键入什么,都应该始终显示San Jose(默认情况下),然后过滤其余元素

示例:键入B,应同时显示圣何塞和波士顿,因为圣何塞是我的默认值,波士顿是输入框上的过滤值

这可能吗?如果没有,有哪些替代方法可以达到相同的结果


如果需要,我可以使用Javascript/Jquery。但是,我不能使用任何自动完成插件。

如果不使用自定义插件,这是不可能的<代码>数据列表支持充其量只是平庸的,目前没有办法影响显示的选项

有些浏览器实现上的差异甚至不会受到影响(Chrome只在选项开始时匹配,FireFox也在其中的任何地方匹配文本)。没有办法改变这一点,更不用说添加自定义方式来显示某些建议了