Блог

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

1. Куда мне поместить общую функцию? Возьмем, к примеру, hello(). Допустим, я планирую использовать эту функцию во всем плагине, где она должна находиться? Прямо сейчас я поместил его наверх, и это, кажется, работает, но я не уверен, что это правильно.

2. Куда мне поместить глобальную переменную? Возьмем, к примеру, мой массив переменных «imgs». Должен ли я объявить это там, где оно у меня есть сейчас, или в моем методе инициализации, или где-то еще?

    (function($){
   
   function hello(){
       alert("hello world");
   }
   var imgs = new Array(); 
   
   var methods = {
       init: function(options){
           if(options){
               $.extend({
                   width: 200,
                   height: 200,                        
                   selectedColor: '#123456'
               }, options);    
   
               // for every image do something
               this.find('img').each(function(){   
                   var $this = $(this);
   
                   var width = $this.width();
                   var height = $this.height();
   
                   console.log("width: "   width   " height: "   height);
   
                   selection = function() {
                       console.log($this.attr('src'));                         
                       hello();                
                   };
   
                   $this.bind('click', selection);                     
               });                 
           }               
           return this;        
       },
       test : function( string ) {
           console.log("Test: "   string);                 
           //return "here";
       }
   };
   
   
   $.fn.Thumbnails = function(method) {      
       // Method calling logic
       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.Thumbnails' );
       }             
   
   };
   
   })(jQuery);
   
   $thumbnails = $('#imagescontainer').Thumbnails({
           height: 150,
   });
     

Спасибо за помощь!

1. Разместите их вне вашей функции jQuery, но внутри самоисполняющейся функции. Это гарантирует, что они существуют только для вашей функции jQuery. Например, вы можете видеть, что служебная функция findText() находится за пределами функции jQuery в моем плагине bumpyText.

2. Это зависит от требуемого срока службы. Если вам это нужно для вызова вашей функции, поместите это внутри вашей функции. Если он должен сохранять свое состояние при каждом вызове плагина (маловероятно), поместите его вне вашей функции jQuery.