Javascript 如何设置ajax请求开始和成功之间的最短时间？

基本上，有时我的应用程序中的AJAX调用太快，我需要延迟其中一些调用。我有一个“进度/加载”图标，当涉及到快速AJAX调用时，图标出现和消失得太快了。我需要一种方法来设置AJAX操作完成的最短时间（或至少以这种方式显示）。这是我在应用程序中使用的通用

ajax

函数

var app = {
    ajax: function (paramObject) {
        $.ajax({
            url: paramObject.url,
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            type: paramObject.method || 'GET',
            data: paramObject.data || '{}',
            success: function (jsonResponse) {
                if (paramObject.success) {
                    if (paramObject.successDelay) {
                        setTimeout(function() {
                            paramObject.success(jsonResponse);
                        }, paramObject.successDelay);
                    } else {
                        paramObject.success(jsonResponse);
                    }
                }
            }
        });
    }
}

如您所见，我有一个

paramObject

，它接受一些参数，如：

url

，

方法

，

数据

，

成功

和

成功延迟

。目前，AJAX调用需要花费时间，当它完成时，会考虑我设置的延迟（

successDelay

）。但那不是我真正想要的。我想要的是跟踪AJAX调用开始和结束/成功之间的延迟，这样整个过程至少需要

successDelay

毫秒

编辑以进一步解释：

本质上，我想让AJAX调用看起来需要更长的时间。它需要发生在我上面的函数中。

[编辑]

如果不理解您的代码，我认为这就是您想要的：

var app = {
    ajax: function (paramObject) {
        var timeStart = Date.now();
        $.ajax({
            url: paramObject.url,
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            type: paramObject.method || 'GET',
            data: paramObject.data || '{}',
            success: function (jsonResponse) {
                if (paramObject.success) {
                    if ((Date.now()-timeStart) < paramObject.successDelay) {
                        setTimeout(function() {
                            paramObject.success(jsonResponse);
                        }, paramObject.successDelay - (Date.now()-timeStart));
                    } else {
                        paramObject.success(jsonResponse);
                    }
                }
            }
        });
    }
}

点击
运行

我还没有测试过它，但我相信它能满足您的需求

var app = {
    ajax: function (paramObject) {
        var $d;
        if (paramObject.successDelay) {
            $d = $.Deferred();
            setTimeout(function() {
                $d.resolve();
            }, paramObject.successDelay);
        }
        $.ajax({
            url: paramObject.url,
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            type: paramObject.method || 'GET',
            data: paramObject.data || '{}',
            success: function (jsonResponse) {
                if (paramObject.success) {
                    if (paramObject.successDelay) {
                        $d.done(function(){
                            paramObject.success(jsonResponse);
                        });
                    } else {
                        paramObject.success(jsonResponse);
                    }
                }
            }
        });
    }
}

---

你为什么要这个？这似乎有点烦人的用户，你会放慢系统只是为了让一个图标显示更长的时间。不管请求需要多长时间，为什么不让图标显示更长的时间呢？不要延迟ajax。使动画完成的时间更长。@Rorymcrossan

为什么不使图标显示的时间稍长一点，而不管请求需要多长时间？

这正是我正在尝试的。请求不会被延迟，只有成功回调会在稍后无意中更新我的UI。@Mikel我只想延迟我的成功操作。不是AJAX请求。好吧，但是如果你可以，比如说，延长$.fadeOut动画的持续时间，就没有必要这样做。这不是对我问题的直接回答，但肯定会把我推向正确的方向。对不起，在你发布之前10分钟，我接受了Blag编辑过的答案：/@Alternatex你可以随时向上投票，如果你找到一个有用的答案

var app = {
    ajax: function (paramObject) {
        var $d;
        if (paramObject.successDelay) {
            $d = $.Deferred();
            setTimeout(function() {
                $d.resolve();
            }, paramObject.successDelay);
        }
        $.ajax({
            url: paramObject.url,
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            type: paramObject.method || 'GET',
            data: paramObject.data || '{}',
            success: function (jsonResponse) {
                if (paramObject.success) {
                    if (paramObject.successDelay) {
                        $d.done(function(){
                            paramObject.success(jsonResponse);
                        });
                    } else {
                        paramObject.success(jsonResponse);
                    }
                }
            }
        });
    }
}