Jquery封装function实例

// JavaScript Document
(function($){
	/*drop menu packaging*/
	$.fn.dropmenu = function(options){
		var defaults = {
			contanier:	'',
			itemsCss:	''  
		}
		var options = $.extend(defaults,options);
		this.each(function(){
			var obj = $(this);
			var objspan = obj.children('li').children('span');
			/*objspan.each(function(index){
				var self = $(this);
				self.bind('click',function(evt){
					if(self.next('ul').size() != 0 ){
						var selfParentSilbings  =  self.parent().siblings();
						self.toggleClass(options.itemsCss,'');
						self.next().toggle(200);
						selfParentSilbings.children('span').removeClass(options.itemsCss);
						selfParentSilbings.children('ul').hide();
					}
				});				
			});*/
			objspan.click(function(){
				var self = $(this);
				if(self.next('ul').size() != 0 ){
					var selfParentSilbings  =  self.parent().siblings()
					self.toggleClass(options.itemsCss,'');
					self.next().toggle(200);
					selfParentSilbings.children('span').removeClass(options.itemsCss);
					selfParentSilbings.children('ul').hide();
				}
			});
		});
	}
	$('.tb_space tr:even').addClass('even'); //give table tr:even add style
})(jQuery);
//html document
<ul class="navigation">
        	<li><span class="current"><a href="javascript:void(0);" mce_href="javascript:void(0);" title="Geographic Settings">Geographic Settings</a></span>
            	<ul style="display:block" mce_style="display:block">
                	<li><a href="countryList.html" mce_href="countryList.html" title="Countries">Countries</a></li>
                    <li><a href="setState.html" mce_href="setState.html" title="">setState</a></li>
                </ul>
            </li>
            <li><span><a href="javascript:void(0);" mce_href="javascript:void(0);" title="Manage City Profiles">Manage City Profiles</a></span>
            	<ul>
                	<li><a href="#" mce_href="#" title="Countries">Countries</a></li>
                    <li><a href="#" mce_href="#" title="">Countries</a></li>
                </ul>
            </li>
            <li><span><a href="javascript:void(0);" mce_href="javascript:void(0);" title="Manage Genre Profiles">Manage Genre Profiles</a></span>
            	
            </li>
        </ul>
//css style
.navigation li span,.navigation li li a{150px;margin:0 0 2px;padding:2px 14px 2px 26px;}
.navigation li span{font-size:1.4em;display:block;line-height:22px;color:#333;background:#fff url(http://images.cnblogs.com/a_i/a_bg.png) no-repeat -1px -28px;}
.navigation li span a:link,.navigation li span a:visited{color:#333;text-decoration:none;line-height:22px;}
.navigation li .current{background-position:-1px 0;}
.navigation li ul{display:none;}
.navigation li li a{display:block;font-size:1.2em;height:1.6em;line-height:1.6em;color:#666;text-decoration:none;background:#fff url(http://images.cnblogs.com/a_i/a_bg.png) no-repeat 0 -81px;}
.navigation li li a:hover,.navigation li li .current{background-position:0 -56px;color:#333;}

写法2 
/**
 * @jQuery Active
 * @Create 03/26/1011
 * @Use function $('#box').funname({item1:'', item2:''});
*/
(function($){
	$.FunName = function ($ele, options){
		this.options = options;
		alert(this.options.item1);
	}
	$.fn.funname = function(options){
		if (typeof options === 'string') {
            options = {
                url: options
            };
        }
		var o = $.extend({},$.fn.funname.defaults,options);
		this.each(function(){
			$this = $(this);
			var FN = new $.FunName($this, o);
			$this.data('funname', FN);
		});//元素操作
	}
	$.fn.funname.defaults = {
		item1:	'',
		item2:	''
	};//设置传参
})(jQuery);

　　===============原文转自===========

http://blog.csdn.net/flyxiang228/article/details/6428489

======================================