我正在使用jQuery开发一个简单的插件。我认为我需要这样做:
(function($) {
var somePrivateFn = function() {
alert(this.x);
}
$.fn.myPlugin = function() {
if(typeof arguments[0] === "string") {
var fnargs = Array.prototype.slice(arguments, 1);
// pluginData will be undefined
var pluginData = this.pluginData;
somePrivateFn.apply(pluginData, fnargs);
}
return this.each(function() {
var data = this.pluginData = {};
data.x = 1;
};
}
})(jQuery);
当然我的插件需要为它正在处理的jquery对象存储一些变量。为此,我只在jQuery对象本身放置一个额外的变量“pluginData”。问题是以后无法访问。怎么处理呢?这样做的最佳方法是什么?
答案 0 :(得分:1)
运行插件时传递对象。 $('div').myPlugin(a_data_object)
它会持续到this.each
循环中。
此var options=$.extend({}, pluginData);
将使一次迭代中的数据不会传递到下一次。
如果您想操作,那么将该数据存储在您将使用$.data()
的元素上。
(function($) {
console.clear();
var somePrivateFn = function(data) {
console.log(data.x);
}
$.fn.myPlugin = function(pluginData) {
// send to another func
somePrivateFn(pluginData);
// use on each div
return this.each(function(i) {
var options=$.extend({}, pluginData);
// add some example data
options.y = "i am y";
options.iteration=i;
options.text=$(this).text();
// store it on the element
$(this).data('pluginData', options);
});
}
// run the plugin on div elements
$('div').myPlugin({x:"i am x"});
// check out the data later
$('div').each(function(){
console.log($(this).data('pluginData'));
});
})(jQuery);
示例:http://jsfiddle.net/xXt5W/1/
$ .data()docs:https://api.jquery.com/jQuery.data/