jQuery插件基础框架

我是使用jQuery的新手。我试图建立一个插件，但它没有奏效。为什么？jQuery插件基础框架

以下是我有：

<head> 
    <script src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript"> 
    (function($){ 
     $.alert = function(settings){ 
     var config = { 
      // settings 
      'text': "old text", 
      'smily': ":(", 
      // ... 
     }; 
     if (settings){$.extend(config, settings);} 
     // variables 
     var i = 0; 
     // script 
     alert(config.text + " " + config.smily); 
    }; 
    </script>  
</head> 

<body> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $.alert(text: "new text", smily: ";)"); 
}); 
</script> 
</body>

来源

2011-09-08 fteinz

分配$.extend返回值（similar question）

if (settings) { config = $.extend({}, config, settings); }

，并调用它是这样的：

$(document).ready(function() { 
    $.alert({ text: "new text", smily: ";)" }); 
});

也从一个工作演示的最后一个默认值'smily': ":(",

Click here删除昏迷。

来源

2011-09-08 13:46:55 AlexBay

我已经尝试过但是它不工作[链接]（http://jsbin.com/eveduc/2/edit#html,live） – fteinz

编辑了一个工作演示，检查它 – AlexBay

你有没有检查演示是否适合你？ – AlexBay

简短演示：

(function($){ 
$.fn.pluginas = function(options) { 
    var defaults = { 
    width: 300, 
    param: "Par", 
    param2: "Par2", 
    }; 
    var options = $.extend(defaults, options); 
    return this.each(function() { 
    }); 
}; 
})(jQuery);

该如何应该是：

(function($){ 

$.alert = function(settings){ 
    var config = { 
    // settings 
     text: "old text", 
     smily: ":(", 
    // ... 
    }; 

    if (settings){$.extend(config, settings);} 
    // variables 
    var i = 0; 

    // script 
    alert(config.text + " " + config.smily); 
} 
})(jQuery);

来源

2011-09-08 13:37:34

'“兴高采烈”：“:(”，'应该是' 'smily'：“:(”''和'param2：“Par2”，'应该是'param2：“Par2”' –

我试过了但它不工作[在jsbin中看到它]（http://jsbin.com/oyopam/edit＃html，live） – fteinz

我不知道你打算如何处理它，但你的插件似乎工作。你只是没有正确地调用它：而不是$.alert(text: "new text", smily: ";)");尝试$.alert({text: "new text", smily: ""});

在开发插件时，保留一些标准是很好的（这些标准可以在http://docs.jquery.com/Plugins/Authoring上看到）。
写一些插件后，我决定遵循标准和发展，应该是我今后所有的插件的基础插件模板：

/** 
*  PLUGIN NAME : 
*  VERSION  : 
*  AUTHOR  : yourname (yourname [at] domain [dot] com) 
*  DESC  : 
*  USAGE  : 
**/ 
(function($,window,undefined){ 
    $.fn.pluginName = function(o){ 
     // some globals 
     var options = $.extend({},$.fn.pluginName.defaults,o); 

     // constructor 
     function pluginName(el,o){ 
      var api = this, 
       $el = $(el); 

      //internal api 
      function _initialise(options){ 

      } 

      function _destroy(){ 

      } 

      // external api 
      $.extend(api,{ 
       initialise : function(){ 
        _initialise.apply(api,arguments); 
        return api; 
       }, 
       destroy : function(){ 
        _destroy.apply(api,arguments); 
        return api; 
       }, 
       reinitialise : function(){ 
        return 
         api 
          .destroy() 
          .initialise.apply(api,arguments); 
       }, 
      }); 
      // initialise 
      _initialise(o); 
     } 

     return $(this).each(function(){ 
      var that = $(this), 
       api = that.data('pluginNameApi'); 
      if(api instanceof pluginName) 
       api.reinitialise(options); 
      else 
       that.data('pluginNameApi',new pluginName(that.get(0),options)); 
     }); 
    } 

    $.fn.pluginName.defaults = { 

    } 
    $.fn.pluginName.version = 1.0; 
})(jQuery,window);

来源

2011-09-08 13:50:30

但只有在这个改变它不工作！ – fteinz

jQuery插件基础框架

回答

相关问题