Plugin Custom Events
Trigger namespaced custom events from your plugin to allow users to hook into plugin lifecycle without modifying the plugin source.
jQuery
Intermediate
4 min read
Plugin Custom Events
Example
$.fn.carousel = function(options) {
return this.each(function() {
const $el = $(this);
function nextSlide() {
$el.trigger("carousel.next"); // before transition
// ... slide logic ...
$el.trigger("carousel.after"); // after transition
}
});
};
// User hooks
$(".slider").on("carousel.next", function() {
console.log("Slide changing...");
}); Pro Tip
Namespace your events (plugin.event) to avoid conflicts with other plugins.