jQuery 自动完成 - 如何处理额外的数据？答案

【问题标题】：jQuery autocomplete - How to handle extra data?jQuery 自动完成 - 如何处理额外的数据？
【发布时间】：2008-12-16 19:42:57
【问题描述】：

我正在努力解决以下问题。我使用jQuery autocomplete plugin 从服务器获取建议值列表。列表如下所示：

用户名1|用户ID1 用户名 2|用户 ID2

所以，如果我开始输入“U”，"Username1" 和 "Username2" 的列表就会弹出，正如预期的那样。我可以选择第一项，<input> 的值将变为"Username1"，但我真正想要发送到服务器的是用户 ID。

我能否以某种方式获取用户名后面的 ID？我打算在更改文本框时进行表单发布。也许我太盲目了，无法在文档中看到它或在 Google 上找到它？

【问题讨论】：

【解决方案1】：

使用autocomplete 插件的result 方法来处理这个问题。数据作为数组传递给回调，您只需将data[1] 保存在某处。像这样的：

$("#my_field").autocomplete(...).result(function(event, data, formatted) {
    if (data) {
        $("#the_id").attr("value", data[1]);
    }
});

【讨论】：

【解决方案2】：

我打算在这里列出一些方法，但除了一个之外都是垃圾。像您一直在做的那样在服务器上进行字符串->用户转换以生成自动完成列表。

无论如何都要保持自动完成并进行 AJAX 验证，但是如果您尝试通过 JS 在表单中走私重要的表单数据（像这样），会在某些时候出错。

此外，如果您需要处理非 js 用户代理，则需要以任何方式编写此方法。

【讨论】：

这不会成为公共应用程序，因此缺少 JS 支持不是问题。不过，总的来说，您是对的。事实上，我正在研究您提出的确切内容，但后来认为这不可能。就是觉得太丑了。
我看不出它有多丑。替代方案：添加额外的表单字段并将它们设置为自动完成选择；或将选定的 ID 保留在 JS 中并将其破解到帖子数据的末尾。再次查找确实是最干净的方法...

【解决方案3】：

仅供参考，这篇文章http://vivien-chevallier.com/Articles/use-bing-maps-rest-services-with-jquery-to-build-an-autocomplete-box-and-find-a-location-dynamically 通过作者的函数 'displaySelectedItem' 有一个很好的方法，该函数通过 jQuery 自动完成 'select' 事件调用（完整代码参见文章）。

干杯

马特

【讨论】：