jQuery plugin - multiple instantiation -


i'm asking help. have clean jquery boilerplate code here:

http://jsfiddle.net/xxw5h/7/

;(function ( $, window, document, undefined ) {       var pluginname = "defaultpluginname",         defaults = {             propertyname: "value"         };        function plugin( element, options ) {         this.element = element;           this.options = $.extend( {}, defaults, options );          this._defaults = defaults;         this._name = pluginname;          this.init();     }      plugin.prototype = {          someval: math.round(math.random() * 99999999),          init: function() {             self = this;              ael = $('<a/>', {                   href: '#',                 text: this.options.propertyname,                 click: function(e){self._clicked();}             });              $(".el1").before(ael);                 $(".el1").before("<br/>");              },          _clicked: function(el, options) {             alert("random value of el instance:" + this.someval);             alert("property name:" + this.options.propertyname);         }     };       $.fn[pluginname] = function ( options ) {         return this.each(function () {             if (!$.data(this, "plugin_" + pluginname)) {                 $.data(this, "plugin_" + pluginname, new plugin( this, options ));             }         });     };  })( jquery, window, document );  $('.el1').defaultpluginname({   propertyname: 'el1 link ' });  $('.el2').defaultpluginname({   propertyname: 'el2 link' }); 

my problem need multiple instantiation , it's troubles begin. know question answered here:

jquery plugin multiple instantiation

but can't make work.

when click @ el1 link @ linked jsfiddle, need show 1 random number , property of first instance of plugin. when click @ el2 link @ linked jsfiddle, need show second random number , property of second instance of plugin. it's same both links.

my question how create own options every instance of plugin? , then, right way create own per instance variables? thanks!

self = this; ael = $('<a/>', {       href: '#',     text: this.options.propertyname,     click: function(e){self._clicked();} }); 

you're assigning global variable self here, overwritten second plugin instantiation , refer that.

add var keyword make local variable.


Comments