Javascript 关于()和多个绑定的Jquery问题

Javascript 关于()和多个绑定的Jquery问题,javascript,jquery,bind,Javascript,Jquery,Bind,我已经编写了一个Jquery插件,以便在我的应用程序中更轻松地处理类似Facebook的功能。到目前为止,插件本身运行良好,但现在我遇到了一个问题 当我调用自定义插件函数时,我希望基本上切换状态。当like成功时,我将类从user like更改为user unline。现在发生的是绑定函数没有更新。链接的文本发生了变化,但当我单击它时,它仍然像那样执行,而不是像那样执行 $('.user-like').like({ success: function(data, textStatus,

我已经编写了一个Jquery插件,以便在我的应用程序中更轻松地处理类似Facebook的功能。到目前为止,插件本身运行良好,但现在我遇到了一个问题

当我调用自定义插件函数时,我希望基本上切换状态。当like成功时,我将类从user like更改为user unline。现在发生的是绑定函数没有更新。链接的文本发生了变化,但当我单击它时,它仍然像那样执行,而不是像那样执行

$('.user-like').like({
    success: function(data, textStatus, jqXHR) {
        $(this).html('Unlike');
        $(this).removeClass('user-like');
        $(this).addClass('user-unlike');
    }
});
$('.user-unlike').unlike({
    success: function(data, textStatus, jqXHR) {
        $(this).html('Like');
        $(this).removeClass('user-unlike');
        $(this).addClass('user-like');
    }
});
如何让Jquery知道已更改的类并绑定正确的函数

以下是我的插件代码:

(function ($) {

    $.likeApi = function (action, options) {
        if (action != 'like' && action != 'unlike') {
            return false;
        }
        var options = jQuery.extend({}, jQuery.likeApi.defaults, options);
        return $.ajax({
            context: this,
            type: "POST",
            url: options.baseUrl + action + '.json',
            data: {
                data: {
                    Like: {
                        foreign_key: options.id,
                        model: options.model
                    }
                }
            },
            success: options.success,
            error: options.error,
            dataType: 'json'
        });
    };

    $.fn.like = function (options) {
        var scopedOptions = options;
        this.on('click', function(event) {
            event.preventDefault();
            $.likeApi('like', $.extend({}, scopedOptions, {
                'id': $(event.target).data('like-fk'),
                'model': $(event.target).data('like-model'),
                'success': $.proxy(options.success, this)
            }));
        });
        return this;
    };

    $.fn.unlike = function (options) {
        var scopedOptions = options;
        this.on('click', function(event) {
            event.preventDefault();
            $.likeApi('unlike', $.extend({}, scopedOptions, {
                'id': $(event.target).data('like-fk'),
                'model': $(event.target).data('like-model'),
                'success': $.proxy(options.success, this)
            }));
        });
        return this;
    };

    $.likeApi.defaults = {
        parent: null,
        baseUrl: '/likes/likes/',
        action: null,
        model: null,
        id: null,
        error: function(jqXHR, textStatus, errorThrown) {
            alert(textStatus);
        },
        success: function(data, textStatus, jqXHR) {
            alert(textStatus);
        }
    };

}(jQuery));
您可以使用:

 $(body).on('click', '.user-like', yourFunction);
或者,您可以检查单击的元素是否存在类:

if ( $(this).hasClass('user-like') ) { /* Do your function */ };

使用其他类作为插件的选择器:

$('.user-action').yourPluginName()
并根据您所处的状态添加“.user like”和“.user nothing”

然后在插件代码中执行以下操作:

  if (this.hasClass('.user-like')) ...

我该如何将我的自定义jquery函数传递给它呢?我不想让我的插件依赖于一些外部因素。