封装组件

不多说，上干货：

(function ($) {

    //1.得到$.ajax的对象

    var _ajax = $.ajax;

    $.ajax = function (options) {

        //2.每次调用发送ajax请求的时候定义默认的error处理方法

        var fn = {

            error: function (XMLHttpRequest, textStatus, errorThrown) {

                toastr.error(XMLHttpRequest.responseText, '错误消息', { closeButton: true, timeOut: 0, positionClass: 'toast-top-full-width' });

            },

            success: function (data, textStatus) { },

            beforeSend: function (XHR) { },

            complete: function (XHR, TS) { }

        }

        //3.如果在调用的时候写了error的处理方法，就不用默认的

        if (options.error) {

            fn.error = options.error;

        }

        if (options.success) {

            fn.success = options.success;

        }

        if (options.beforeSend) {

            fn.beforeSend = options.beforeSend;

        }

        if (options.complete) {

            fn.complete = options.complete;

        }

        //4.扩展原生的$.ajax方法，返回最新的参数

        var _options = $.extend(options, {

            error: function (XMLHttpRequest, textStatus, errorThrown) {

                fn.error(XMLHttpRequest, textStatus, errorThrown);

            },

            success: function (data, textStatus) {

                fn.success(data, textStatus);

            },

            beforeSend: function (XHR) {

                fn.beforeSend(XHR);

            },

            complete: function (XHR, TS) {

                fn.complete(XHR, TS);

            }

        });

        //5.将最新的参数传回ajax对象

        _ajax(_options);

    };

})(jQuery);

主要的步骤分为：

1）定义默认的error处理方法。

2）判断用户在调用$.ajax({})的时候是否自定了error:function(){}，如果定义过，则使用用户定义的，反之则用默认的error处理方法。

3）使用$.extend()将error默认处理方法传入$.ajax()的参数中。我们看options参数时包含$.ajax()方法里面所有的参数的，然后用默认的fn去扩展它即可。

通过以上三步就能够实现对$.ajax()方法里面error默认处理方法。这样扩展，对于我们使用者来说完全感觉不到变化，我们仍然可以$.ajax({});这样去发送ajax请求，如果没有特殊情况，不用写error处理方法。

文章参考：http://www.cnblogs.com/landeanfen/p/5124542.html