Jquery插件例子

(function($){   
    $.fn.yourName = function(options){ 
      //各种属性、参数 
     var defaults = {            
          evenRowClass:"evenRow",
            oddRowClass:"oddRow",
            activeRowClass:"activeRow"    
     }
   }
// $.extend 表示合并参数    
    var options = $.extend(defaults, options);  
     this.each(function(){     
  //插件实现代码      
    });  
  };
})(jQuery);
/*
 * tableUI 0.1
 * Copyright (c) 2009 JustinYoung  http://justinyoung.cnblogs.com/
 * Date: 2010-03-30
 * 使用tableUI可以方便地将表格提示使用体验。先提供的功能有奇偶行颜色交替,鼠标移上高亮显示
 */
(function($){
    $.fn.tableUI = function(options){
        var defaults = {
            evenRowClass:"evenRow",
            oddRowClass:"oddRow",
            activeRowClass:"activeRow"           
        }
        var options = $.extend(defaults, options);
        this.each(function(){
            var thisTable=$(this);
            //添加奇偶行颜色
            $(thisTable).find("tr:even").addClass(options.evenRowClass);
            $(thisTable).find("tr:odd").addClass(options.oddRowClass);
            //添加活动行颜色
            $(thisTable).find("tr").bind("mouseover",function(){
                $(this).addClass(options.activeRowClass);
            });
            $(thisTable).find("tr").bind("mouseout",function(){
                $(this).removeClass(options.activeRowClass);
            });
        });
    };
})(jQuery);
//页面调用
 $().ready(function(){  $(".table_solid").tableUI({evenRowClass:"evenRow_new",oddRowClass:"oddRow_new",activeRowClass:"activeRow_new"}); })

 

posted @ 2010-08-26 16:38  知足常乐(Mr.Zhang)  阅读(833)  评论(0编辑  收藏  举报