Question

In jQuery plugins, which way do you think it’s best to allow a function to be hooked in your plugin – trough triggers, or options (arguments) passed in the plugin function?

$.trigger('myplugin_completed', someData);

$(document).bind('myplugin_completed', function(event, someData){ ... });

vs

myPluginOptions.onComplete(someData);

$('.stuff').myPlugin({onComplete: function(someData){ ... }});

Answer 1

Solution

I think the best solution – at least in the case you described (maybe not in all the possible cases) – is to combine both in the following way:

$('.stuff').myPlugin(/* some options here */);
$('.stuff').trigger('myplugin.completed', someData);

and this line:

$('.stuff').on('myplugin.completed', function(event, someData){
    /* callback code */
});

is responsible for binding the event handler. It can be called also when someone passes onComplete callback within options when initializing your plugin (of course selector should be adjusted to meet the one used by the code initializing your pugin).

Summary

To sum up, you could:

• create your own event (completed),
• use your plugin’s namespace for this event / plugin (in this case myplugin),
• use .on() function (available and preferred since jQuery 1.7),
• if onComplete option is passed to your plugin, there is no problem in binding it within the code initializing the plugin (so from within the plugin, using the .on() function, binding event handler to your event name within your even namespace).