новый плагин JQuery плагин - PullRequest
1 голос
/ 17 ноября 2009

Я только начинаю изучать плагины jQuery и хочу выполнить своего рода упражнение «Привет, мир», используя шаблон объектно-ориентированного плагина barebones. Но я не могу получить выражение console.log в функции setup () ниже для отображения в окне консоли firebug.

Я называю плагин так:

<script type="text/javascript" src="myPlugin.js" >
<script type="text/javascript"> 
  $(document).ready() {
    $('ul').myPlugin();
  });
</script>

myPlugin.js:

;(function($) {

  $.fn.extend({
      myPlugin: function(options) {
          return this.each(function() {
              new $.MyPlugin(this, options);
          });
      }
  });

  $.MyPlugin = function(element, options) { 
      var defaults = {          
          helloText: "hello World"          
      }

      this.options = $.extend({}, defaults, options || {}); 

      this.setup();     
  };

  $.extend($.MyPlugin.prototype, {

    setup: function() {
        console.log(this.helloText);        
    }   
  });   
})(jQuery);

Как я уже сказал, оператор console.log в функции setup () не отображается. Понятия не имею почему. Однако, если я, например, помещу оператор console.log сразу после верхней строки, он будет работать:

;(function($) {
  console.log('hello world');

..... Может кто-нибудь сказать мне, что я делаю не так?

Ответы [ 2 ]

2 голосов
/ 17 ноября 2009

Ваш звонок неверный:

<script type="text/javascript" src="myPlugin.js"></script>
<script type="text/javascript"> 
    $(document).ready(function(){
        $('ul').myPlugin();
    });
</script>
0 голосов
/ 17 ноября 2009

Амброзия указывает на проблему, о которой вы спрашивали, поскольку ваш звонок был неверным. Ваш .ready() не содержит функцию.

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

;(function($) {

  $.fn.myPlugin = function(options) {
     return this.each(function() {
       (new $.MyPlugin(this, options));
     });
  };

  $.MyPlugin = function(element, options) {     
     this.options = $.extend({}, $.MyPlugin.defaults, options); 

     this.setup = function(){
       console.log(this.helloText);
     };

     this.setup();         
  };

  $.MyPlugin.defaults = {                      
     helloText: "hello World"                      
  }; 

})(jQuery);

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

$.MyPlugin.defaults.helloText = "Something Else";
$('ul').myplugin(); // Outputs 'Something Else' to the console

Я написал помощника для плагинов jQuery под названием Starter для jQuery , но существует множество других замечательных ресурсов.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...