使用html5 datalist自定義自動填充

Question

我正在使用html datalist自動填充一些數據。我想要一個行爲，它應該過濾除一個默認值以外的所有內容。下面是示例代碼：

<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，它會顯示只有聖何塞和舊金山，當我N型，它會顯示只有紐約。

我的要求是，在任何情況下，無論輸入什麼，它都應該始終顯示聖何塞（默認情況下），然後過濾其餘元素。

示例：鍵入B，應顯示聖何塞和波士頓，因爲聖何塞是我的默認值，波士頓是輸入框中的過濾值。

這可能嗎？如果不是，取得相同結果的替代方法是什麼？

JSFiddle

我沒關係使用JavaScript/jQuery的如果需要的話。但是，我無法使用任何自動完成插件。

Answer 1

這是不可能的，不使用自定義插件。 datalist支持仍然是平庸的，目前還沒有辦法影響顯示的選項。

有一些瀏覽器實現的差異甚至無法受到影響（Chrome僅在選項開始時匹配，FireFox也在文本中其他任何位置匹配文本）。沒有辦法改變這一點，更不用說添加自定義的方式來顯示某些建議。