javascript - 如何为一个搜索框实现两个高级自动完成？

Question

我需要有关如何实现此功能的帮助和提示。我有一个搜索框。正确的搜索查询可能是：巴黎的汽车。{location} 中的 {category}。

1. 当用户开始键入第一个字符时，将出现类别的搜索提示。
2. 用户从提示选项中选择“汽车零件”。
3. 选择选项后，“[space-key]in[space-key]”会自动添加到搜索框中。
4. 将出现针对这些位置的新搜索提示。用户选择巴黎。
5. 选择位置后进行搜索。

关于如何实现这一点的任何提示？

Answer 1

这是我的建议：

1. 使用 jquery UI 进行自动建议（非常容易实现，易于定制以适应您的特定情况）http://jqueryui.com/demos/autocomplete/。我的建议是让 jQuery 检查用户是否正在输入类别或位置（通过查看输入是否为空）并基于此运行不同的自动完成调用。

2. jQuery UI 有一个名为“选择”的事件。使用它将所选项目 + 添加到文本字段中。

3. 现在，当用户输入其他内容时，让 jQuery 识别是时候输入位置，并调用 jQuery UI 自动完成功能来建议位置。