javascript - 自动完成之间的 JQuery 共享功能

Question

示例 JQuery 自动完成代码。我想要一个可以由两个单独的自动完成实例调用的函数，它允许我共享相同的功能而无需重写代码。

$("tags1").autocomplete(
{
               source: availableTags
});

以确保这一点很清楚。我不想重复代码。因此，当我在其他地方使用另一个自动完成时，我想引用自动完成中包含的代码而不是重复代码（我只是重复了自己）

Answer 1

您可以发出手动 ajax get 请求来获取数据，将其存储在一个变量中，然后只为两个自动完成功能存储该变量。

var cache = {},
    requestData = function(request, response) {
        var term = request.term;
        if(term in cache) {
            response(cache[term]);
            return;
        }

        $.getJSON("search.php", request, function(data, status, xhr) {
            cache[term] = data;
            response(data);
        });
    };

$("#birds").autocomplete({
    minLength: 2,
    source: requestData
});

$("#moreBirds").autocomplete({
    minLength: 2,
    source: requestData
});

来源：http: //jqueryui.com/resources/demos/autocomplete/remote-with-cache.html

但是你真的应该从服务器发送缓存头告诉客户端缓存请求的结果。然后，当第二个自动完成发出相同的请求时，浏览器将不必再次访问服务器。

这是一篇关于该主题的精彩文章：https ://devcenter.heroku.com/articles/increasing-application-performance-with-http-cache-headers