Question

I’ve a jQuery plug-in that operates on some ULs, adding and removing classes etc.

During the life-cycle of the page, I’ll need to add/ remove some classes in code, and as my plug-in needs to perform some additional operations when this happens I came up with the following:

// This is the initialiser method...
$.fn.objectBuilder = function (options) {...};
// These are the two new methods I need.
$.fn.objectBuilder.setSelected(element) {...};
$.fn.objectBuilder.removeSelected() {...};

I’d then like to call them like this:

$("#ob1").objectbuilder.removeSelected();

Any thoughts?

Thanks,
Kieron

edit

I suppose what I’m asking is, whats the best way of adding additional methods to a jQuery plug-in where it’ll have access to the root object, in this case #obj when the method is called.

Answer 1

My solution for this has always been events. I setup namespaced events on each object so they can be triggered later:

$.fn.testPlugin = function() {
  return this.each(function() {
    $(this).bind('testPlugin.event1', function() {
       blah, blah, blah;
    });
  });
};

And then later…

$('#obj1').trigger('testPlugin.event1');

jQuery UI uses another solution which is a bit more complicated. You can check it out here: http://jqueryui.com/docs/Developer_Guide