下拉菜单的快速自动完成答案

【问题标题】：Fast autocomplete for drop-downs下拉菜单的快速自动完成
【发布时间】：2009-12-29 22:16:26
【问题描述】：

我正在使用 JQuery 的自动完成插件，但速度不快，而且与我的网站无关。我想要一个像www.hotels.com 这样的自动完成功能。我怎样才能实现这种类型的自动完成？有插件吗？

【问题讨论】：

我猜你必须从头开始构建它。您可以使用 Firebug 或 Charles 查看 ajax 请求和响应主体的外观以模拟行为，但我严重怀疑是否有专门的插件。但是，正如我妻子经常提醒我的那样，我很有可能犯错。
在不知道您想要实现什么的情况下，我们如何判断哪些内容与您的网站相关，哪些内容与您的网站无关。 “我想要那样”是对您问题的极差描述。
@spender 我正在创建我想要相同类型下拉菜单的餐厅门户。这就是为什么我给出了确切的例子。其中 ppl 将从位置名称搜索。

标签： php jquery jquery-plugins autocomplete

【解决方案1】：

Hotels.com 使用自定义 JSON 请求/响应。如果你打开萤火虫，你会看到拨出电话：

Search for "London"

此调用在 keyup 时立即触发，并返回 JSON 数据：

Response from Hotels.com

除此之外，没有什么特别花哨的东西，只是一个具有准确数据库搜索功能的高性能服务器。 Javascript 中没有自动完成功能。

【讨论】：

【解决方案2】：

因此，您宁愿想要一个下拉过滤器而不是下拉自动完成？例如。当您键入“foo”时，您希望列出“foobar”、“afooba”和“bazfoo”，而不是仅列出“foobar”和“foobaz”等起始匹配项？

如果是这样，那么我可以建议使用 Quicksilver 算法的 Quickselect 或使用 Liquidmetal 算法的 Flexselect。值得一提的是，大约一年前我已经使用了这两个，并决定继续使用最后一个，因为它可以更好地自定义以使其与其他 jQuery 插件（例如 Validator 和 qTip）兼容。

【讨论】：

【解决方案3】：

您喜欢 www.hotels.com 的哪些方面？您希望将哪些数据投射到自动完成功能中？这些数据从哪里来？在考虑实施细节之前，您需要回答这些问题。

【讨论】：

【解决方案4】：

好东西要花钱。在您正在进行的这个特定基准测试中，如果您看得足够近，您将能够看到hotels.com 使用了 Yahoo JS 框架和不同的自定义函数...

【讨论】：

【解决方案5】：

自动完成中 80% 的工作是在后端完成的。后端需要非常快速地返回查询响应。我怀疑 jquery 是否是你的问题。使用 firebug 的“网络”面板了解往返时间是多少，以及服务器延迟是多少。解决那个问题。其余的很容易。 FWIW，我非常幸运地使用 GWT 的建议框直接进入 oracle 数据库（我放弃了大多数 Web 层，除了非常薄的直通以获得我正在寻找的响应能力）。在大约 50 毫秒内回复用户

【讨论】：