Method ignoring callback function in jQuery plugin

Question

I am developing a plugin in jQuery and the problem or difficulty is:

I created the methods init, show and hide;

(function( $ )
    $.fn.tooltip = function(method, onClick, onBefore, onAfter) {

        var default = {
            'onClick' : function() {},
            'onBefore': function() {},
            'onAfter' : function() {},
        };

        var settings = $.extend({}, default, options);

        var methods = {
           init : function(options) {
              return this.each(function(){
                  var $this = $(this);
                  methods.show.apply($this);
                  settings.onClick.call($this);
              });
           },
           show : function() {
              return this.each(function(){
                  var $this = $(this);
                  settings.onBefore.call($this);
                  //Aqui vem a manipulação de classes...
                  .
                  .
                  .
                  .
                  .
                  methods.close.apply($this);
              });
           },
           hide : function() {
              return this.each(function(){
                  var $this = $(this);
                  settings.onAfter.call($this);
                  //Aqui vem a manipulação de classes...
              });
           }
        };

        if ( methods[method] ) {
            return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
        } 
        else if ( typeof method === 'object' || ! method ) {
            return methods.init.apply( this, arguments );
        } 
        else {
            $.error( 'Method ' +  method + ' does not exist on jQuery.tooltip' );
        }    
    };
})( jQuery );

When I call through the method init everything works perfectly, but when I call through the Hide method $('#test').myPlugin('hide'); the Hide method runs, but the callback function settings.onAfter($this); is ignored.

Calling the method init

$('#test').myPlugin({
    onClick: function(){
        $('.button').myPlugin('hide');
    },
    onBefore: function(){
        $('body').addClass('onBefore');
    },
    onAfter: function(){
        $('body').addClass('onAfter');
    }
});

When I call the method init he calls the show, this method does everything that needs to be done (class manipulation) and after all it calls the method hide. The hide does everything that needs to be done as well and then calls callback function onAfter, perfect!

But when I call the method hide through the callback function onClick, it performs the right method, just ignore the callback onAfter

Answer 1

I made some adjustments to your code. Run this example and look at the browser console.

   $(function(){
   $("#ipTeste").tooltip('hide');
   //$("#ipTeste").tooltip('show');
   //$("#ipTeste").tooltip('init');
});

(function($){
    $.fn.tooltip = function(method) {
        
        var defaultV = {
            'onClick' : function(el) {
                console.log("onClick...");
            },
            'onBefore': function(el) {
                console.log("onBefore...");
            },
            'onAfter' : function(el) {
                console.log("onAfter...");
                defaultV.onBefore();
                defaultV.onClick();
                
                $(el).tooltip('show');
                $(el).tooltip('init');
            }
        };
        
        var settings = $.extend({}, defaultV);
        
        var methods = {
            init : function(options) {
                return this.each(function(){
                    console.log("INIT...");
                    var $this = $(this);
                    settings.onClick.call({}, $this);
                    //Aqui vem a manipulação de classes...
                });
            },
            show : function() {
                return this.each(function(){
                    console.log("SHOW...");
                    var $this = $(this);
                    settings.onBefore.call({}, $this);
                    //Aqui vem a manipulação de classes...
                });
            },
            hide : function() {
                return this.each(function(){
                    console.log("HIDE...");
                    var $this = $(this);
                    settings.onAfter.call({}, $this);
                    //Aqui vem a manipulação de classes...
                });
            }
        };
        
        if ( methods[method] ) {
            return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
        } 
        else if ( typeof method === 'object' || ! method ) {
            return methods.init.apply( this, arguments );
        } 
        else {
            $.error( 'Method ' +  method + ' does not exist on jQuery.tooltip' );
        }   
    };
})( jQuery );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="ipTeste"/>