初めて簡単な jquery プラグインを作成しようとしていますが、jquery オブジェクト内にプライベート変数を作成する方法がわかりません。ここにコードがあります
var first;
var second;
$(document).ready(function(){
first = $("#clicker1").demSelector();
second = $("#clicker2").demSelector();
});
$(".totalClicks").click(function(){
alert("Clicks 1 = "+first.number());
alert("Clicks 2 = "+second.number());
});
(function($){
var num = 0;
$.fn.demSelector = function() {
return this.each(function(){
init(this);
});
};
$.fn.number = function(){
return num;
};
function init(control){
$(control).on('click','.num-of-clicks', function(){
num = parseInt($(this).html(),0) + 1;
$(this).html(num);
});
}
})(jQuery);
およびデモ プロジェクトhttp://jsbin.com/afEduKI/9/edit
「0」をクリックすると、変数 num がインクリメントされて変更されます。ただし、最初と 2 番目のオブジェクトの num を変更します。したがって、最初の行を2回クリックして「表示」ボタンをクリックすると、「クリック1 = 2」と「クリック2 = 2」という2つのメッセージが表示されますが、「クリック1 = 2」と「クリック2 = 0」である必要があります。その変数 num はグローバルのようです。
私は何を間違っていますか?