Question

我是编写jQuery插件的新手，我对如何让用户在他们的选项中使用$（this）感到困惑。作为一个简单（和冗余）的例子，假设我想让用户将他们的选择文本附加到他们提供的元素中，如下所示：

$(function() {
   $('#stuff').appender({ 'placement' : this });
});

插件代码是：

(function($) {
    $.fn.appender = function(options) {

        var opts = $.extend({}, $.fn.appender.defaults, options);

        return this.each( function() {
            var $el = $(this);
            $(opts.placement).append( $el.text() );
        });

    };

    $.fn.appender.defaults = {
        'placement' :   'body',
    }
})(jQuery);

如果用户在插件选项中为'placement'提供'body'或$（'＃wrapper'），当然它会按预期工作。但是当使用'this'或'$（this）'时，它指的是文档本身而不是选择中的元素。

这是一个非常糟糕的插件示例，但我想学习的是如何允许插件用户使用$（this）或其属性作为选项的值。

有什么想法吗？

Answer 1

您不能在插件中执行此操作，除非您为其指定默认名称或特殊字符串名称，例如"self"转换为this。要将其作为参考传递，他们需要.each()，如下所示：

$('#stuff').each(function() } $(this).appender({ 'placement' : this }); });

对于 inside 插件选项，我会说 nothing 默认为this，所以它看起来像这样：

$(opts.placement || this).append($el.text()); //call looks like this: $('#stuff').appender();

或者有一个特殊的字符串（不太直观，我会使用上面的默认值），它看起来像这样：

$(opts.placement === "self" ? this : ops.placement).append($el.text()); //call looks like this: $('#stuff').appender({ placement: 'self' });

插件选项中的$（this）

1 个答案: