ajax延遲插件

zhangwang 發布于2019-08-21 10:47 / 2995人閱讀

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

GPU云服務器云服務器 jquery_ajax分頁插件 ajax() ajax? ajax

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/86210.html

performance-report頁面性能、資源、錯誤、ajax，fetch請求上報插件完善小巧

摘要：只做頁面性能數據的采集和上報，是比較完整和健全的數據上報插件，它可以幫你完成以下功能是比較完整和健全的數據上報插件，它可以幫你完成以下功能當前頁面上一頁面當前瀏覽器版本信息頁面性能數據信息，例如頁面加載時間，白屏時間，解析時間等當前頁面 performance-report只做頁面性能數據的采集和上報，是比較完整和健全的數據上報插件，它可以幫你完成以下功能： performance-r...

testbird 2019-08-22 16:24 評論0 收藏0
select2 和 ajax的坑

select2，一款帶多選功能，樣式更加好看的select插件。下方記錄坑，前方高能. 要用ajax發請求并且為select2賦初始值 $.ajax({ url : _ctx+/basInfo/listPsinfoData, data : page=1&rows=9999&flag=...

VEIGHTZ 2019-08-02 15:22 評論0 收藏0
select2 和 ajax的坑

select2，一款帶多選功能，樣式更加好看的select插件。下方記錄坑，前方高能. 要用ajax發請求并且為select2賦初始值 $.ajax({ url : _ctx+/basInfo/listPsinfoData, data : page=1&rows=9999&flag=...

plokmju88 2019-08-23 18:21 評論0 收藏0