javascript - jQuery自动完成超时

Question

出于某种原因，我在我正在处理的网站上发出的 ajax 请求有一半的时间会中止。当我为 ajax 请求设置超时时，此问题已解决，如下所示。

$.ajax({
    url: "/question/why_wont_it_work",
    timeout : 1000,
    success: function(){ /*do stuff*/ }
});

遗憾的是，超时修复似乎不适用于 jquery 自动完成功能。我这样使用它：

$( "#questionTags" ).autocomplete({
    source: "/question/tags",
    timeout: 1000,
    select: function(event, ui) { /*do stuff*/ },
});

我检查了网站上的 jQueryUI 文档，也没有看到超时选项。现在这很烦人，因为有一半的时间我的请求会中止并且我不会得到我想要的结果。有没有解决的办法？

提前致谢。

Answer 1

您可以为参数提供任意函数source。因此，您可以手动发出 AJAX 请求并指定timeout选项：

var xhr = null; /* To prevent multiple calls from happening while one is in progress */
$("#questionTags").autocomplete({
    source: function (request, response) {
        if (!xhr) {
            xhr = $.ajax({
                url: "/question/tags",
                timeout: 20000,
                data: request,
                dataType: "json",
                success: function (data) {
                     xhr = null;
                     response(data);
                },
                error: function () {
                    response([]);
                }
            });
        }
    },
    select: function(event, ui) { /*do stuff*/ },
});

但我和@El Ronnoco 在一起，你可能想认真加快你的请求。20秒是很长的等待时间。

Answer 2

如果source是字符串，jQuery 自动完成会执行下面显示的代码来加载数据，因此它不会设置超时。

您可以像这样使用ajaxSetup全局设置超时：

$.ajaxSetup({
    timeout: 20000,
});

但这会影响您所有的 ajax 请求。

---

来自 jquery.ui.autocomplete.js :: _initSource 的代码

self.xhr = $.ajax({
    url: url,
    data: request,
    dataType: "json",
    context: {
        autocompleteRequest: ++requestIndex
    },
    success: function( data, status ) {
        if ( this.autocompleteRequest === requestIndex ) {
            response( data );
        }
    },
    error: function() {
        if ( this.autocompleteRequest === requestIndex ) {
            response( [] );
        }
    }
});

Answer 3

$target.autocomplete('/question/why_wont_it_work',{
        delay: 2000
    });