我正在创建一个简单的jQuery插件,并且无法使其模块化。
例如:
$.fn.testMethod = function(option1, option2) {
var something1 = option1;
var something2 = option2;
};
当我使用此方法有多个元素时,我的问题就开始出现了。例如:
$('.element1').testMethod(1, 2);
$('.element2').testMethod(3, 4);
如果我正在改变东西,第二个元素最后会使用第一个后面的变量。什么是更好的方法来执行此操作并将变量锁定到他们正在使用的特定元素?如果这太模糊了,我可以粘贴我的完整代码,但它有点复杂。
答案 0 :(得分:1)
使用jQuery插件时,通常需要执行each
循环并返回集合。
这也意味着你不能只使用简单的变量,但jQuery的data
就派上用场了。
$.fn.testMethod = function(option1, option2) {
return this.each(function() {
$(this).data('something1', option1);
$(this).data('something2', option2);
// do stuff
var something = $(this).data('something1'); // etc
});
};
另一方面,函数内部的参数和变量对于每个函数调用都是唯一的,因此对函数的第二次调用不会使用第一次调用的变量,除非你'做其他奇怪的事。