[jQuery] Using instance-variables when creating a new Plugin
Hi,
here is a plug-in that I have been working on:
(function($) {
$.fn.extend({
prioritySelector : function() {
// Private members
var list;
var textbox;
// Takes value from textbox and highlights appropriate
button
function refreshGui() {
deselectAll();
var prio = parseInt(textbox.val());
$(list.find('li').get(prio))
.addClass('selected');
}
// Binds events to each prio-button
function bindEvents() {
list.find('li').click(priority_click);
}
// Event: Occurs when prio-button gets clicked
function priority_click() {
var index = list.find('li').index(this);
textbox.val(index);
refreshGui();
}
// Deselects all prio-buttons
function deselectAll() {
list.find('li').removeClass('selected');
}
// Constructor
return this.each(function() {
list = $(this);
textbox = list.parent().parent().find('.tbPrio');
refreshGui();
bindEvents();
});
}
});
})(jQuery);
It works good if I apply it only once, however if I use it multiple
times on the same page, the click-event (handled in priority_click() )
only works on the last one added.
I think it is because the way I have stored my "instance-variables"
and they become class-variables instead, wich makes this work only
once.
Is there a way to store instance-variables for a jQuery-plugin?
Any other suggestions?
Thanks!