jquery插件私人和公共属性

我想写我的第一个简单的jquery插件，但我不知道如何在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。但它改变了第一个和第二个对象的数量。因此，在第一行点击两下并单击“显示”按钮后，我会收到两条消息“点击1 = 2”和“点击2 = 2”，但它应该是“点击1 = 2”和“点击2 = 0”。它看起来像变量num是全局的。

我在做什么错了？

来源

2013-08-30 cmd

JavaScript不明确支持公共和私有变量。但是，您可以使用[闭包]（http://stackoverflow.com/questions/111102/how-do-javascript-closures-work）来模拟它们。 – Blazemonger

我知道JavaScript不支持公共或私人修改器，但我怎么可以让变量“num”是唯一的每个对象？ – cmd

这是因为您在事件处理程序中使用回调函数 - 它正在修改名为'num'的全局变量，并且无法访问您的“私有”变量'num'。 – Blazemonger

你应该做什么它使用.data()存储相关的DOM元素的数据。事情是这样的：

var first; 
var second; 
$(document).ready(function(){ 
    first = $("#clicker1").data('count',0); 
    second = $("#clicker2").data('count',0);  
}); 

$(document).on('click','.clicker', function(){ 
    $(this).data('count',$(this).data('count')+1); 
    $(this).find('.num-of-clicks').html($(this).data('count')); 
});

http://jsbin.com/afEduKI/11/edit

来源

2013-08-30 17:20:29 Blazemonger

但有没有其他方法？编写这段代码的原因是学习jquery插件和处理插件中的事件。 – cmd

你“私下”存储被点击元素内的“count”数据。无论使用或不使用插件，这都是您想要达到的最佳方式。我唯一知道的其他方法是使用全局变量，这绝对是要在插件中避免的。 – Blazemonger

jquery插件私人和公共属性

回答

相关问题