如何爲datalist應用滾動條？

Question

我有一個用於自動完成的數據列表。

如何將滾動條應用到它？

我的HTML代碼：

<input list="languages" id="language_id" /> 
<datalist id="languages" style="visibility:hidden;white-space:nowrap;overflow:scroll;"> 
    <option value="html">HTML</option> 
    <option value="java">Java</option> 
    <option value="perl">Perl</option> 
    <option value="php">PHP</option> 
    <option value="ruby-on-rails">Ruby on Rails</option> 
</datalist> 

而且還當我雙擊文本框所有的話都顯示。如何在雙擊時隱藏所有顯示的單詞？

Answer 1

使用Javascript可以使滾動條，你可以使用單點擊後在焦點上的datalist顯示項目。

Answer 2

不幸的是，你可以用datalist屬性做很多事情。數據列表當前不支持任何CSS樣式，特定的視覺特徵是特定於瀏覽器的。某些瀏覽器可能會選擇爲長列表添加滾動條。

如果這是不可接受的，您可能不得不忘記數據列表並通過Javascript實現組合框。我相信JQuery有一個可能適合的自動完成功能。