为jQuery AJAX调用添加超时

Question

我继承了以下内容作为knockout.js网格的一部分。

当您单击图像输入时，它会用搜索结果填充网格。

如果服务器超时（比如30秒），我想让它重新加载页面，但我对jQuery非常陌生，不知道从哪里开始。

我可以在代码中看到success，并在计时方面找到了大量资源，但不确定测试什么或在哪里测试等等。

如果可以的话，请告知并提前感谢！

self.submitSearch = function () {
    $("#foundMembersTableParent").block({ message: '<img src="/Content/images/spinnerLarge.gif" /> Searching...' });
    self.selectedMembers.removeAll();
    fnOnSearch();
    $.ajax({
        type: 'POST',
        url: '/Members/MSearch',
        contentType: "application/json; charset=utf-8",
        data: self.getFormData(),
        success: function (data) {
            self.members($.map(data.searchResults, function (item) { return new Members(item) }));
            $("#foundMembersTableParent").unblock();
        },
        dataType: "json"
    });
}
self.getFormData = function () {
    var frmobj = $('#complexSearchForm').serializeObject();
    return JSON.stringify(frmobj);
 }

Answer 1

只需在ajax请求中添加timeout和error处理程序：

$.ajax({
    type: 'POST',
    url: '/Members/MSearch',
    contentType: "application/json; charset=utf-8",
    data: self.getFormData(),
    success: function (data) {
        self.members($.map(data.searchResults, function (item) { return new Members(item) }));
        $("#foundMembersTableParent").unblock();
    },
    dataType: "json",
    timeout: 30000,      // 30 seconds
    error: function(qXHR, textStatus, errorThrown) {
        if (textStatus === "timeout") {
            // request timed out, do whatever you need to do here
        }
        else {
            // some other error occurred
        }
    }
});

请参阅文档：https://api.jquery.com/jQuery.ajax/

作为一个疯狂的猜测，我认为你可能正在使用这个插件：

http://malsup.com/jquery/block/#element

在这种情况下，在error处理程序中，您真正需要做的就是：

$("#foundMembersTableParent").unblock();

将功能恢复到网格。当然，您可能还想在某个地方显示一条错误消息，以便用户理解为什么表没有更改。