10条建议帮助你创建更好的jQuery插件

(function($) {  
  //code here 
})(jQuery);

var defaultSettings = {   mode      : 'Pencil',   
               lineWidthMin  : '0',   
               lineWidthMax  : '10',   
               lineWidth    : '2' }; 
settings = $.extend({}, defaultSettings, settings || {});

$.fn.wPaint = function(settings) {  
 return this.each(function() { 
    var elem = $(this);    
  //run some code here   
 } 
}

var defaultSettings = {  
               mode      : 'Pencil',   
               lineWidthMin  : '0',   
               lineWidthMax  : '10',   
               lineWidth    : '2' }; 
settings = $.extend({}, defaultSettings, settings || {});
$.fn.wPaint = function(settings) {  
 return this.each(function() { 
    var elem = $(this);    
  //run some code here   
 } 
}

function Canvas(settings) {  
 this.settings = settings;   
 this.draw = false;   
 this.canvas = null;    
   this.ctx = null;  
  return this;
}

Canvas.prototype = {   
 generate: function() { 
    //generate code  
 } 
}

Canvas.prototype = {  
 generate: function()  { 
    //some code    
  var $this = this;    
  var buton = //...some code  
    button.click(function(){ 
    //using this will not be found since it has it's own this    
    //use $this instead.     
   $this.someFunc($this);    
  });  
 }, 
 someFunc: function($this)   {  
    //won't know what "this" is.  
   //use $this instead passed from the click event  
  } 
}

function Canvas(settings) {  
 this.settings = settings;  
  return this; 
}

generate() 
appendColors() 
colorSelect() 
colorHoverOn() 
colorHoverOff() 
appendToElement() 
showPalette() 
hidePalette()

var lineWidth = $("#container").wPaint("lineWidth"); 
$("#container").wPaint("lineWidth", "5");