用大量元素替换组合框的好 Javascript 组合框？答案

【问题标题】：Good Javascript Combo Box replacement for combo boxes with tons of elements?用大量元素替换组合框的好 Javascript 组合框？
【发布时间】：2010-09-20 16:49:33
【问题描述】：

我有一个页面，其中我的组合框包含数百个元素，因此很难选择我想要的一个项目。有没有比 Javascript 更好的替代品

<select id="field-component" name="field_component"> 
                  <option selected="selected">1</option><option>2</option>...
</select>

有类似“Intellisense”的自动完成功能吗？

【问题讨论】：

标签： javascript html combobox dhtml

【解决方案1】：

在 HTML 5 中有标准的组合框。

目前只有 Opera 支持它，但如果你碰巧是时间旅行者或只编写 Opera 应用程序，这是一个不错的解决方案:)

<input type=text list=listid>
<datalist id=listid>
  <select><option>1<option>2</select>
</datalist>

【讨论】：

【解决方案2】：

您有dhtmlCombo，在填写输入字段时使用 ajax 检索数据。

dhtmlxCombo 是一个具有自动完成功能的跨浏览器 JavaScript 组合框。

它扩展了基本的选择框功能，以满足最新 Web 应用程序的要求。

dhtmlxCombo 可以从现有的 HTML SELECT 转换或使用 JavaScript 填充。支持 AJAX，还可以从服务器数据源动态获取列表值。

【讨论】：

我见过的最好的。可惜它不是免费的:(

【解决方案3】：

查看jQuery Autocomplete插件，使用方便，只需要在服务器端生成一个JSON响应即可。

见this demos。

【讨论】：

【解决方案4】：

使用Prototype 和Scriptaculous 的autocompleter 在这种情况下效果很好。

【讨论】：

【解决方案5】：

请注意：如果选择框是当前焦点，您可以在键盘上键入，它会将您带到以该文本开头的选择，因此在美国州下拉菜单中键入“ken”将自动选择“肯塔基”选项。

【讨论】：

【解决方案6】：

你可以试试这个combobox实现http://www.zoonman.com/projects/combobox/

纯 JavaScript。可编辑。支持 IE6。
非标准 HTML 布局。

【讨论】：

【解决方案7】：

我认为 Twitter 的免费 typeahead.js 库是当今最好的自动完成库。查看http://twitter.github.io/typeahead.js/

【讨论】：