最近遇到需要做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!'); });