jQueryUI 自动完成响应数据答案

【问题标题】：jQueryUI autocomplete response datajQueryUI 自动完成响应数据
【发布时间】：2013-05-14 14:05:38
【问题描述】：

场景

我在页面中有一个 jQueryUI autocomplete。通过 AJAX 调用检索数据。一切正常。

问题

对于jQueryUI API，source 属性是一个setter。

是否有任何自动完成属性暴露检索到的数据？

换句话说，如果我重新关注自动完成绑定的输入并且它仍然包含以前搜索的术语，我可以在不重新执行 ajax 调用的情况下显示自动完成结果吗？

我已经搜索过类似的questions。感谢SirDerpington，我成功地重新打开了结果菜单。尽管如此，AJAX 调用还是会被重新处理。

        $('mySelector').autocomplete().on("focus", function () {
            $(this).autocomplete("search");
        })

所以问题仍然存在。

【问题讨论】：

标签： jquery-ui autocomplete jquery-ui-autocomplete

【解决方案1】：

如果我理解正确，如果用户重新关注输入，您想显示相同的结果吗？

在我的 jsfiddle 中，它似乎可以工作，但我不确定这是否会触发 AJAX 调用。不管怎样，看看我做了什么：

$('#autocomplete').autocomplete({
    source: availableTags,
    minLength: 0
}).focus(function () {
    var $this = $(this);
    var inputVal = $this.val();
    //just a check to prevent showing all results if inputVal is empty
    if (inputVal !== '') {
        $this.autocomplete("search");
    }
});

注意docs 对search 作为方法的评价：

当不带参数调用时，使用当前输入的值。

编辑

使用某种“缓存”似乎是解决问题的好方法。因为我不能真正使用源代码，所以我只使用了 jsfiddle 的 /echo/json/ 并将缓存设置为整个源代码（availableTags）。但是假设您有一个真实的请求并保存响应。使用真实来源时它会正常工作。（当结果被缓存并且输入没有改变时，警报不会弹出）

updated fiddle

更新代码

var cache = {};
$('#autocomplete').autocomplete({
    source: function (request, response) {
        var term = request.term;
        //check if searched input is in cache and return it as response
        if (term in cache) {
            response(cache[term]);
            return;
        }

        $.getJSON("/echo/json/", request, function (data, status, xhr) {
            alert("Request triggered!");
            //write response in cache
            cache[term] = availableTags;
            response(availableTags);
        });
    },
    minLength: 0
}).focus(function () {
    var $this = $(this);
    var inputVal = $this.val();
    if (inputVal !== '') {
        $this.autocomplete("search");
    }
});

在 cmets 中也提到过，但在这里再次提到：Documentation Entry

【讨论】：

+1。好点，它有效。缺点：ajax调用被重新执行。
也许remote cache 功能会起作用？没有机会使用服务器端源测试autocomplete。
我刚刚添加了一个更新的小提琴。如果您重新聚焦输入并且输入值相同，则不会触发请求。但是，如果您想要最多一个请求，只需让它触发一次并将响应设置为源，就像使用 availableTags 作为源时一样

【解决方案2】：

我通常使用 javascript Array 对象填充我的文本字段自动完成数据。因此，在页面加载时，该文本字段将始终只有指定的自动完成文本。比如：

var contentArray = ["John", "Doe"];
$("#textfieldid").autocomplete({
   source: contentArray

对不起，如果我误解了你的问题，但如果可以的话，我想提供帮助。

【讨论】：