仅当getJSON花费超过n毫秒时才显示元素?

I have some JavaScript:

我有一些JavaScript:

surveyBusy.show();

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
        surveyBusy.hide();
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
        surveyBusy.hide();
    });

However, I'd like to only issue surveyBusy.show(); if $.getJSON takes more than n number of milliseconds. You get a flicker otherwise. Is there a callback on the getJSON api that can do this? I see nothing in the documentation.

但是，我只想发布surveyBusy.show();如果美元。getJSON需要超过n毫秒。否则就会闪烁。getJSON api上是否有一个回调函数可以做到这一点?我在文档中没有看到任何东西。

7 个解决方案

#1

Just use a timeout. Also, I put your "hide" code in the always handler to reduce code repetition.

只使用一个超时。另外，我将“隐藏”代码放在always处理程序中，以减少代码的重复。

var busyTimeout = setTimeout(function() { surveyBusy.show(); }, 2000);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
    })
    .always(function() {
        clearTimeout(busyTimeout);        
        surveyBusy.hide();        
    });

#2

Put your surveyBusy.show() call inside a timeout and then cancel that timeout (using window.clearTimeout) if the result is returned before it activates:

将surveyBusy.show()调用放在超时内，如果结果在激活前返回，则取消超时(使用windows . cleartimeout):

var busyTimeout = window.setTimeout(function() { surveyBusy.show(); }, 500);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
    })
    .always(function() {
        window.clearTimeout(busyTimeout);        
        surveyBusy.hide();        
    });

#3

Use setTimeout:

使用setTimeout:

var busy = window.setTimeout(function(){
    surveyBusy.show();
}, 1000);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        // ...
        window.clearTimeout(busy);
        surveyBusy.hide();
    })
    .fail(function (jqXHR, textStatus, err) {
        // ...
        window.clearTimeout(busy);
        surveyBusy.hide();
    });

#4

Try this setting a timeout, then canceling it when the server responds:

尝试设置超时，然后在服务器响应时取消:

// NOT TESTED

var n = 5000 // milliseconds
var tmr = setTimeout(function(){
    surveyBusy.show();
}, n);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
        clearTimeout(tmr) ;
        surveyBusy.hide();
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
        clearTimeout(tmr) ;
        surveyBusy.hide();
    });

#5

This will set up a method within the surveyBusy object that will avoid having to create a setTimeout method under the window object. It gives you something a lot more reusable!!

这将在surveyBusy对象中设置一个方法，以避免在窗口对象下创建一个setTimeout方法。它给你提供了更多可重用的东西!

surveyBusy = {
    onTimer: function(n) {
        elapsed = new Date.getTime() - start;
        if (elapsed > n) surveyBusy.show();
    }
}
surveyBusy.hide();
var start = new Date().getTime();
var elapsed = 0;

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
    })
    .always(function() {
        surveyBusy.onTimer(5000);
    });

#6

Actually, according to this page, which describes the callbacks for all AJAX routines, there is a timeout callback that you can use. It will require that you don't use the $.getJSON shortcut. So, to provide a REAL answer to the question, YES it is in the API but buried deeper than the $.getJSON shortcut.

实际上，根据这个描述所有AJAX例程回调的页面，您可以使用一个超时回调。它要求你不要使用$。getJSON捷径。因此，为了给这个问题提供一个真正的答案，是的，它在API中，但是比$更深。getJSON捷径。

timeout Type: Number Set a timeout (in milliseconds) for the request. This will override any global timeout set with $.ajaxSetup(). The timeout period starts at the point the $.ajax call is made; if several other requests are in progress and the browser has no connections available, it is possible for a request to time out before it can be sent. In jQuery 1.4.x and below, the XMLHttpRequest object will be in an invalid state if the request times out; accessing any object members may throw an exception. In Firefox 3.0+ only, script and JSONP requests cannot be cancelled by a timeout; the script will run even if it arrives after the timeout period.

超时类型:为请求设置超时(以毫秒为单位)的数字。这将使用$. ajaxsetup()覆盖任何全局超时设置。超时时间从$开始。ajax调用;如果有其他几个请求正在进行中，并且浏览器没有可用的连接，那么在发送请求之前，请求可以超时。在jQuery 1.4。如果请求超时，XMLHttpRequest对象将处于无效状态;访问任何对象成员都可能抛出异常。仅在Firefox 3.0+中，脚本和JSONP请求不能被超时取消;即使脚本在超时时间之后到达，它也将运行。

#7

-1

var n = 1000; //number of ms to wait
var done = false;
window.setTimeout(function(){
    if(!done){
        surveyBusy.show();
    }
}, n);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
        done = true;
        surveyBusy.hide();
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
                done = true;
        surveyBusy.hide();
    });

#1