javascript - jquery plugin add event listener -
i have jquery plugin have created, shows content , hides content in tab interface. wanting trigger event when content shown can listen in source code, , fire event based on possible?
here plugin,
$.fn.appstabs = function(options){ // these defaults. var settings = $.extend({ // these defaults. selected: "home" }, options ); // set active $(this).find('.pops-tabs-navigation li[data-route="'+settings.selected+'"]').addclass('active'); // hide boxes , show first 1 $(this).find('.apps-tabs-content .pops-tab-content').addclass('cloak'); $(this).find('.pops-tabs-content .pops-tab-content#content-'+settings.selected).removeclass('cloak'); // clicks on li in navigation $(this).find('.apps-tabs-navigation li').click(function(){ if($(this).hasclass('active') == false) { // id of tab id = $(this).attr('id'); tabid = 'content-'+id; // set active $(this).parent('.apps-tabs-navigation').find('li').removeclass('active'); $(this).addclass('active'); // hide boxes $(this).parent('.apps-tabs-navigation').parents('.pops-tabs').find('.pops-tabs-content .pops-tab-content').addclass('cloak'); $(this).parent('.apps-tabs-navigation').parents('.pops-tabs').find('.pops-tabs-content #'+tabid).removeclass('cloak'); } }); }
is possible maybe add prototype , listen in main application code?
in plugin code, can trigger custom event , listen in page javascript:
plugin
// show element (example) $('#myelement').show(); // trigger custom event $(document).trigger('mycustompluginevent');
page
// event listener custom event 'mycustompluginevent' $(document).on('mycustompluginevent', function() { // when custom event occurs });
Comments
Post a Comment