jQuery插件创作：我如何让我的插件在多组值上运行？

Question

我有一个jQuery插件：

(function($){ 
    $.fn.test = function(selector){ 
     $this = this; 

       $(selector).bind("click", function(){ 
        methods.showvalue($this); 
       }); 
    }; 
    var methods = { 
     showvalue : function($this){ 
      var output = ""; 
      $this.each(function(i,e){ 
       output += $(e).val(); 
      }) 
      alert(output); 
     } 
    } 
})(jQuery); 

有了这个标记：

<form> 
    <p> 
     First section<br /> 
     <input type="text" class="test" name="firstValue" value="one" /> 
     <input type="text" class="test" name="secondValue" value="two" /> 
     <input type="text" class="test" name="thirdValue" value="three" /> 
     <button type="button" id="button1">push</button> 
    </p> 
    <p> 
     Second section<br /> 
     <input type="text" class="test2" name="firstValue2" value="1" /> 
     <input type="text" class="test2" name="secondValue2" value="2" /> 
     <input type="text" class="test2" name="thirdValue2" value="3" /> 
     <button type="button" id="button2">push</button> 
    </p> 
</form> 

这初始化：

$(document).ready(function(){ 

     // first section 
     $(".test").test("#button1"); 

     // second section 
     $(".test2").test("#button2"); 
    }); 

无论我按哪个按钮，我总是得到一个字符串“ 123“。我的目标是当第二个按钮被按下时获得“123”，而第一个按钮被按下时“onetwothree”。

我错过了什么？为什么不这样做？

Answer 1

需要声明

var $this = this; 

否则，$这得到连接到窗口并成为全球。

此外，你可能想这个代替，所以不重视的几个回调：

$.fn.test = function(selector){ 
    var $this = this; 
    $(selector).bind("click", function(){ 
     methods.showvalue($this); 
    }); 
    return this; 
}; 

编辑：演示http://jsfiddle.net/VSDLJ/

Answer 2

客户可以参考的对象在每个循环：

return this.each(function() { 
    obj = $(this); 
}); 

或者你的情况：

return this.each(function() { 
    $this = $(this); 
    $(selector).bind("click", function(){ 
    methods.showvalue($this); 
    }); 
});