Обратный вызов пользовательского плагина jQuery - новый вопрос

Question

Я знаю, что многие люди задают вопросы о плагинах и обратных вызовах (и я прочитал их много - вот как я дошел до этого), поэтому, пожалуйста, потерпите меня Я попробовал свои силы в очень простом плагине типа "аккордеон", чтобы скрыть / показать, для часто задаваемых вопросов, и мне удалось заставить его делать то, что я хотел. Однако, поскольку я все еще учусь, я не совсем уверен, как работают некоторые вещи. После прочтения этого вопроса и некоторых других я смог добавить обратный вызов в плагин.
Мой вопрос: правильный ли этот код и есть ли лучший способ реализовать этот обратный вызов? Вот рабочий образец и код ниже. Спасибо за ваше время.

( function($) {
$.fn.simpleFAQ = function( options, callback ) {
    // define default options
    var defaults = {
        textExpand      : "Expand all",
        textCollapse    : "Collapse all",
        displayAll      : false,
        toggleSpeed     : 250
    };
    var options = $.extend( defaults, options );
    // callback
    if( typeof callback != "function" ) { callback = function(){} }

    this.each( function () {
        obj = $(this);
        // insert FAQ expand all/collapes all text before FAQ
        var txt = '<span class="simple_jfaqText"><a href="javascript:;" rel="jfaq_expand">' + options.textExpand + '</a> / <a href="javascript:;" rel="jfaq_collapse">' + options.textCollapse + '</a></span>';
        $( txt ).insertBefore( obj );

        // add class to desired FAQ element
        obj.addClass( 'simple_jfaq' );

        // show/hide faq answers according to displayAll option
        ( options.displayAll == false ) ? ddDisplay = 'none' : ddDisplay = 'block';
        obj.children( 'dd' ).css( 'display', ddDisplay );


        // add classes according to <dd> state (hidden/visible)
        obj.children( 'dd:visible' ).prev( 'dt' ).addClass( 'expanded' );
        obj.children( 'dd:hidden' ).prev( 'dt' ).addClass( 'collapsed' );

        obj.children( 'dt' )
            .click( function() {
                // show/hide all answers (dd elements) on click
                $(this).nextUntil( 'dt' ).slideToggle( options.toggleSpeed, callback );
                // dt class change on click
                $(this).toggleClass( 'collapsed' ).toggleClass( 'expanded' ); })
            .hover( function() { $(this).toggleClass( 'hover' ); }, function(){ $(this).toggleClass( 'hover' ); });
    });

    // Expand All
    obj.prev( 'span' ).children( 'a[rel=jfaq_expand]' ).click( function() {
        // show all answers
        $(this).parent( 'span' ).next( '.simple_jfaq' ).children( 'dd:hidden' ).slideToggle( options.toggleSpeed );
        setTimeout( callback, options.toggleSpeed )
        // change classes
        $(this).parent( 'span' ).next( '.simple_jfaq' ).children( 'dt' ).removeClass( 'collapsed' ).addClass( 'expanded' );
    });

    // Collapse all
    obj.prev( 'span' ).children( 'a[rel=jfaq_collapse]' ).click( function() {
        // hide all answers
        $(this).parent( 'span' ).next( '.simple_jfaq' ).children( 'dd:visible' ).slideToggle( options.toggleSpeed );
        setTimeout( callback, options.toggleSpeed );
        // change classes
        $(this).parent( 'span' ).next( '.simple_jfaq' ).children( 'dt' ).removeClass( 'expanded' ).addClass( 'collapsed' );
    });
};
})( jQuery );

Answer 1

Я бы порекомендовал использовать для этого встроенную в jQuery систему событий .Вы можете вызвать событие на любом узле, тогда пользователь кода часто задаваемых вопросов может привязаться к этому событию на этом узле.Вы даже можете передавать данные в функцию привязки.

Конечно, моя реальная рекомендация - использовать мой плагин с тем же именем.:)

Answer 2

Было бы неплохо, если бы обратный вызов выполнялся в контексте некоторого соответствующего элемента.

var clicked = this;
setTimeout(function() { callback.call(clicked); }, options.toggleSpeed );