jQuery 插件 ajax 按钮

jQuery 插件参数获取  options

 

 

(function ($, window) {
    $.fn.ajaxButton = function (options) {

        var AjaxButton = function (clickedBut, opts) {
            this.clickedBut = clickedBut;
            this.opts = opts;
        };

        AjaxButton.prototype = {
            constructor: AjaxButton,
            _disableView: function () {
                this.clickedBut.html('<i class="fa fa-spin"><i class="fa fa-spinner"></i></i>' + this.opts.text);
                this.clickedBut.attr("disabled", true);
            },
            _recoverView: function () {
                this.clickedBut.html(this.opts.html);
                this.clickedBut.attr("disabled", false);
            },
            _runAjax: function () {
                this._disableView();
                var me = this;
                jQuery.ajax({
                    type: this.opts.method,
                    url: this.opts.url,
                    data: this.opts.params,
                    dataType: 'json',
                    success: function (data) {
                        if (data.success) {
                            console.log('成功:', data.msg);
                        } else {
                            console.log('失败:', data.msg)
                        }
                        me.opts.callback(data);
                        me._recoverView();
                    }, error: function (data) {
                        console.log(' >>>>> Error:', data);
                        me._recoverView();
                    }
                });
            }
        };

        this.each(function () {
            var $button = $(this),
                opts = jQuery.extend({html: $button.html(), text: $button.text(), url: $button.data('url'),
                    confirmText: $button.data('confirm'), callback: function (data) {
                    }, editData: function (data) {
                    }}, options || {});
            opts.params = $.extend({}, $button.data());
            opts.method = $button.data('method') || 'get';
            $.each(['url', 'confirm', 'method'], function (i, v) {
                delete opts.params[v]
            });
            $button.on('click', function () {
                var $this = $(this);
                opts.editData(opts);
                if (!opts.confirmText || window.confirm(opts.confirmText)) {
                    var button = new AjaxButton($this, opts);
                    button._runAjax();
                }
                return false;
            })
        });
    }
}(jQuery, window));

 

 jQusery 获取表单的值

  $form.serializeArray()

你可能感兴趣的:(jQuery 插件 ajax 按钮)