jQuery: методы плагинов, как я могу передать вещи в них? - PullRequest
Новая
       34

jQuery: методы плагинов, как я могу передать вещи в них?

4 голосов
/ 17 ноября 2010

В последнее время я пишу множество крошечных плагинов для своих веб-проектов, но я все еще очень начинающий в разработке плагинов.

Я много читал о плагинах jquery, но просто не могуоберните мою голову вокруг methods.

Вот как в основном выглядят мои текущие плагины: 

(function($){

    $.fn.extend({ 

        myHelper: function(options) {

            var defaults = {
                some: 'defaults'
            }

            var options =  $.extend(defaults, options);

            return this.each(function() {
                var o = options;

                function next(target) {
                    // do something like slide to the next image in a slideshow 
                    // based on the target and count passed in
                    slide('right');
                }
                function prev(target) {
                    slide('left');
                }

                function slide(direction) {
                    // animation for sliding in the next one
                    $('ul > li.current').animate({ … }, 800);
                }

                // doesn't exactly make sense but its just to illustrate what I need to do.
                $('.next').click(next($('ul > #example'));


            });
        }
    });

})(jQuery);

Чем я являюсь после этого, и я подумал, что метод - это путь сюда ...это в основном не иметь все эти именованные функции для крошечных кусочков функциональности и вместо этого определять методы, такие как nextSlide, prevSlide, reset, loop я думаю, вы поняли идею ...

Возможно, вы заметили, что я передаю в функцию такие вещи, как цель (например, next()), а затем вызываю next() как отдельную вещь.

Теперь я хочу начать делатьэто просто с помощью метода, делающего все это и позволяющего мне писать в моем plugin.js файле, например, $(o.nextBtn).nextSlide();.

Но как мне написать метод, который принимает аргументытакие как target в гоis example?

Все примеры и учебные пособия для методов, которые я нашел до сих пор, в основном не имели возможности принимать аргументы в функцию метода.Это вообще возможно?

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

Если вы знаете, как создаватьчто-то, что делает то, что я хочу сделать аккуратно и организованно или у меня есть хороший учебник, на который я должен обратить внимание, пожалуйста, поделитесь.

Спасибо.

1 Ответ

4 голосов
/ 17 ноября 2010

Рекомендуемый способ создания плагина jQuery - это поместить все ваши методы в массив, а затем использовать основную функцию плагина для доступа к ним.

Например, используя некоторые из вашего примера: 

function($) {
    var methods = {
      next(target) {
          target.foo();
      }
 };

 $.fn.plugin = function( method ) {

    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 );

To use it then:
var blah = $('#' + elemID).plugin('init');
blah.plugin('next','#'+ some_other_element);

В этом примере blah - это объект, представляющий ваш плагин, а затем вы используете метод плагина для вызова функций и передачи взначения.

...