javascript - Concernant le développement du plug-in jQuery, les valeurs par défaut définissent une méthode avec un objet vide. Comment ajouter des méthodes à cette méthode vide lorsqu'elle est appelée en externe ?

Question

Il s'agit d'un simple plug-in écrit par moi-même. Le problème est commenté dans le code ci-dessous

.

(function($, window, document, undefined) {
    // 创造一个公共变量来构建一个私有方法
    var privateFunction = function() {
        // 不是很明白这个私有方法要如何使用，具体有什么用，找了一下资料也不是很明白
    }
    var methods = {
        nTab: function(options) {
            return this.each(function() {
                // 关于 data() 有没有必要用在这里，我理解 data() 函数是用来保存插件默认没有的参数或方法用的。不知道这样理解对不对。和我预留一个onSomeEvent 函数来增加一些功能有什么区别？
                var $this = $(this);
                var defaults = {
                    tabTitle: '.product-tab-title li',
                    tabContent: '.product-tab-content',
                    tabTitleState: 'active',
                    tabContentBlock: 'block',
                    tabContentNone: 'none',
                    eventType: 'click',
                    onSomeEvent: function() {} // 这个为空的方法我预留处理打算以后遇到需要添加功能的时候使用，但怎么弄都不知道具体的使用方法
                };
                var settings = $.extend({}, defaults, options);
                $this.find(settings.tabTitle).on(settings.eventType, function() {
                    index = $(this).index();
                    $(this).addClass(settings.tabTitleState).siblings().removeClass(settings.tabTitleState);
                    $(settings.tabContent).eq(index).addClass(settings.tabContentBlock).removeClass(settings.tabContentNone)
                                                    .siblings(settings.tabContent).addClass(settings.tabContentNone).removeClass(settings.tabContentBlock);
                });
            });
        }
    };
    $.fn.userInCommonUseJsPlugin = function() {
        var method = arguments[0];
        if(methods[method]) {
            method = methods[method];
            arguments = Array.prototype.slice.call(arguments, 1);
        } else/* if( typeof(method) == 'object' || !method ) {
            method = methods.init;
        } else */{
            $.error( 'Method ' +  method + ' does not exist on jQuery.pluginName' );
            return this;
        }
        return method.apply(this, arguments);
    }
})(jQuery, window, document);

Voici mon code lorsque j'appelle vers l'extérieur

$(function(){
            $('.nTab').userInCommonUseJsPlugin('nTab', {
                // 我想找这里写一个onSomeEvent: function() {}来增加插件没有的功能，该如何实现
            });
        })

Le problème est commenté dans le code ci-dessus, j'espère que quelqu'un pourra me donner quelques conseils ! ! !

Answer 1

Je n'ai pas écrit de plug-in jquery depuis longtemps. Je devrais utiliser la méthode $.extend pour étendre la valeur ajoutée externe à la partie interne

.

Answer 2

J'ai déjà trouvé une des réponses, concernant l'utilisation des fonctions de rappel
http://learn.jquery.com/plugi...

Comment écrire la fonction de rappel dans le plug-in

 var defaults = {
    // We define an empty anonymous function so that
    // we don't need to check its existence before calling it.
    onImageShow : function() {},
 
    // ... rest of settings ...
 
};
 
// Later on in the plugin:
 
nextButton.on( "click", showNextImage );
 
function showNextImage() {
 
    // Returns reference to the next image node
    var image = getNextImage();
 
    // Stuff to show the image here...
 
    // Here's the callback:
    settings.onImageShow.call( image );
}

Utilisez la fonction de rappel lorsque vous appelez en externe

$( "ul.imgs li" ).superGallery({
    onImageShow: function() {
        $( this ).after( "<span>" + $( this ).attr( "longdesc" ) + "</span>" );
    },
 
    // ... other options ...
});