插件方法声明 – 无法使其工作

我一直在努力解决使用插件在一个对象上使用方法的正确语法。 这是基本框架：

      (function($) { $.test = function(el, options) { this.whiten = function() { $(this).css('background-color', options.bg); } }; $.test.settings = { bg: 'white' }; $.fn.test = function(options) { options = $.extend(options, $.test.settings); return this.each(function() { $.test(this, options); }); }; })(jQuery); $(document).ready(function() { $('#list').test().css('background-color', 'wheat'); $('#go').click(function() { $('#list').whiten(); }); });    whiten 
 
Aloe
 
Bergamot
 
Calendula
 
Damiana
 
Elderflower
 
Feverfew
 
   

我想我不确定的是如何进行function分配。 $.test this内容将引用包含在我的列表中的jQuery对象，所以我会认为this.myMethod = function() {会有效，但事实并非如此。 $(this)将是一个双包装器， el是我的列表（我不想直接将该方法分配给该对象，因为我无法像这样调用它： $('#list').whiten() ）和$(el)与$(this)相同……所以这是怎么做的？

– 更新 –

我已经创建了一个[ jsfiddle ]来解决这个问题

– 更新 –

我也尝试将该方法放在$.fn.test函数中，但无济于事

Answer 1

试试这个：

  $.fn.test = function(options) { options = $.extend(options, $.test.settings); var self = this; return this.each(function() { $.test(self, options); }); }; 

Answer 2

在多次哭泣和咬牙切齿之后，我想通了。 我不确定我理解它为什么会这样，但是现在我很开心它！

        whiten 
 
Aloe
 
Bergamot
 
Calendula
 
Damiana
 
Elderflower
 
Feverfew