ajax延迟显示,ajax延迟插件

最近遇到需要做ajax延迟的需求，上一段代码记录下：

var XHRService = function(options) {

this.options = options;

this.reqTimer = null;

};

XHRService.prototype = {

constructor: XHRService,

req: function(options) {

var that = this,

defer = $.Deferred();

clearTimeout(this.reqTimer);

this.reqTimer = setTimeout(function() {

that._req(options, defer);

}, this.options.reqDelay);

return defer.promise();

},

_req: function(options, defer) {

var that = this;

if (this.xhr) {

this.xhr.abort();

}

if (typeof this.options.before === 'function') {

clearTimeout(this.loadingTimer);

this.loadingTimer = setTimeout(function() {

that.options.before();

}, this.options.loadingDelay);

}

this.xhr = $.ajax(options).done(function(data) {

defer.resolve(data);

})

.always(function(res, status, xhrObj) {

clearTimeout(that.loadingTimer);

if (typeof that.options.after === 'function') {

that.options.after();

}

if (xhrObj === that.xhr) {

that.xhr = null;

}

});

}

};

var xhr = new XHRService({

reqDelay: 10,

loadingDelay: 10,

before: function() {

console.log('show loading...');//显示loadingbar

},

after: function() {

console.log('hide loading...');//隐藏loadingbar

}

});

xhr.req({

url: url,

dataType: 'json'

}).done(function(data) {

console.log('done!');

});