如何使用带有jQuery AutoComplete的选择框?

时间:2011-10-10 19:48:39

标签: jquery jquery-ui

现在我在文本框中输入了自动完成小部件。理想情况下,它会是一个选择框,但我无法弄清楚如何让某人在选择框中输入。

所以我被降级为有一个文本框和一个隐藏的盒子。隐藏的框应该使用文本框中显示的内容的ID进行更新。

我对jQuery很陌生,至少在像这样的深层次上。我是否比我需要的更难?我肯定需要自动完成功能,因为可能有数十万种可能的值。

3 个答案:

答案 0 :(得分:17)

您应该查看名为chosen的jQuery插件 我认为这是过去一年(或更多)写的最好的jQuery插件。

  

Chosen是一个JavaScript插件,它使长而笨重的选择框更加用户友好。它目前有jQuery和Prototype两种版本。

答案 1 :(得分:17)

“选择”有一个非常好的选择 - "Select2" (jQuery only)

  

“Select2”用例

     
      
  • 通过搜索增强原生选择。
  •   
  • 使用更好的多选界面增强原生选择。
  •   
  • 从JavaScript加载数据:通过ajax轻松加载项目并让它们可搜索。
  •   
  • 嵌套optgroups:native选择仅支持一级嵌套。 Select2没有此限制。
  •   
  • 标记:动态添加新项目的能力。
  •   
  • 使用大型远程数据集:根据搜索词部分加载数据集的能力。
  •   
  • 对大型数据集进行分页:在结果滚动到最后时,轻松支持加载更多页面。
  •   
  • 模板:支持自定义呈现结果和选择。
  •   

答案 2 :(得分:10)

在jQueryUI演示页面上有自动完成的a great example。它实际上使用select元素作为后备存储。

您可以轻松修改此选项以使用远程数据源。如果您需要远程源,请告诉我,我可以提供一个示例。