создание JQuery плагин с множеством функций

Question

нормально являюсь своего рода новым плагинам я использовал много в моих проектах, я также написал основные плагины, которые просто работают на элементах с параметрами:

(function($){ 
    $.fn.pulse = function(options) { 
     // Merge passed options with defaults 
     var opts = jQuery.extend({}, jQuery.fn.pulse.defaults, options); 
     return this.each(function() { 
      obj = $(this);    
      for(var i = 0;i<opts.pulses;i++) { 
       obj.fadeTo(opts.speed,opts.fadeLow).fadeTo(opts.speed,opts.fadeHigh); 
      }; 
      // Reset to normal 
      obj.fadeTo(opts.speed,1); 
     }); 
    }; 
    // Pulse plugin default options 
    jQuery.fn.pulse.defaults = { 
     speed: "slow", 
     pulses: 2, 
     fadeLow: 0.2, 
     fadeHigh: 1 
    }; 
})(jQuery); 

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

$('#div').myplugin.doThis(options); 
$('#div').myplugin.doThat(options; 

причина в том, у меня есть довольно большой скрипт, который делает различные Аякса вызовы для сохранения данных и запрашивать данные из базы данных (используя внешний php-файл) Я бы хотел, чтобы я ntergrate все эти функции в плагин, но я не знаю, какую лучшую структуру использовать для него, ive посмотрел на столько учебников и в основном жарил мой мозг, и я смущен, как я должен делать это.

это просто вопрос о создании новой функции, как:

$.fn.pluginname.dothis = function(options){ 
     return this.each(function() { 
      //execute code 
     }; 
    }; 

любые указатели на это, или шаблон, чтобы я начал было бы очень полезно.

навсегда нуждается в помощи !!!

---

следующая проблема:

(function($){ 
// Can use $ without fear of conflicts 
    //var gmap3plugin = $.fn.gmap3plugin; 
    var obj = this; // "this" is the jQuery object 

    var methods = { 
     init : function(options){ 
      var lat = $.fn.gmap3plugin.defaults[lat]; 
      var lng = $.fn.gmap3plugin.defaults[lng]; 
      alert('init'+' lat:'+lat+' --- lng:'+lng); 
     }, 
     show : function() { }, 
     hide : function() { }, 
     update : function(content) { } 
    }; 



    $.fn.gmap3plugin = 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.tooltip'); 
     }; 
    }; 
    $.fn.gmap3plugin.defaults = { 
     mapdiv :'#mapdiv', 
     region : 'uk', 
     lat : 53.4807125, 
     lng : -2.2343765 
    }; 
})(jQuery); 

это работает и получает правильную функцию, которая передается, но как я получить доступ к значениям в $ .fn.gmap3plugin.defaults код в мои инициализации метод возвращает неопределенное для широчайшие и LNG

init : function(options){ 
    var lat = $.fn.gmap3plugin.defaults[lat]; 
    var lng = $.fn.gmap3plugin.defaults[lng]; 
    alert('init'+' lat:'+lat+' --- lng:'+lng); 
}, 

или может я не доступ к THHE данных в $ .fn.gmap3plugin.defaults из функции ???

Answer 1

Если посмотреть на дизайн некоторых других плагинов JQuery и JQuery UI, что они делают, они имеют одну функцию $('#div').myplugin({options}), а затем они могут выполнять различные функции, передавая строку вместо объекта $('#div').myplugin('performdifferenttask') который может в свою очередь, вызовите вспомогательную функцию, которая скрыта от пользователя.

Для примера посмотрите на http://jqueryui.com/demos/progressbar/#methods

Вот пример, который мы надеемся облегчить ваше замешательство:

(function($) { 
    $.fn.myplugin = function(options) { 
     if(options == 'function1') 
      function1(); 
     else if(options == 'function2') 
      function2(); 
     else { 
      //do default action 
     } 
    } 

    function function1() { 
     //do something 
    } 

    function function2() { 
     //do something else 
    } 
} 

Тогда в использовании:

$.myplugin({option1: 4, option2: 6}); //does default behavior 
$.myplugin('function1'); //calls function1() 
$.myplugin('function2'); //calls function2() 

Answer 2

После ответа Самуила, вы можете также используйте следующее, чтобы избежать двойного обращения с именами функций:

(function($) { 
    $.fn.myplugin = function(options, param) { 
     if(typeof(this[options]) === 'function') { 
      this[options](param); 
     } 
     // do default action 

     this.function1 = function() { 
      //do something 
     } 

     this.function2 = function(param) { 
      //do something else (with a parameter) 
     } 
    }  
} 

Добавление переменной param позволяет вызывать функции, как показано ниже:

$.myplugin(); // does default behaviour 
$.myplugin('function1'); // run function 1 
$.myplugin('function2'); // run function 2 
$.myplugin('function2',{ option1 : 4, option2 : 6 }); // run function 2 with a parameter object 

См http://jsfiddle.net/tonytlwu/ke41mccd/ для демонстрации.