自己动手写 accordion 抽屉控件

//EXTUI 控件核心库(function ($) {    $.extUI = {};    $.extUI.controls = {};    //组件类    window.Compent = $.extUI.Compent = function (controlname,options) {        Compent.preRender();        Compent.render();        Compent.rended();        if ($.extUI.controls[controlname])         {            $.extUI.controls[controlname]["preRender"].call(this,options);            $.extUI.controls[controlname]["render"].call(this,options);            $.extUI.controls[controlname]["rended"].call(this,options);        }    };    $.extend($.extUI.Compent, {        preRender: function () {        },        render: function () {        },        rended: function () {        }    }); })(jQuery);  (function ($) {    $.fn.extend({        accordion: function (options) {            //调用组件组件基类进行初始化            $.extUI.Compent.call(this, "accordion",options);                }    });    //    $.extUI.controls.accordion = function (options) {        $.extUI.controls.accordion.preRender();        $.extUI.controls.accordion.render(options);        $.extUI.controls.accordion.rended();    }    $.extend($.extUI.controls.accordion, {        render: function (options) {            //当前accord面板元素            var rootaccordion = this;            if (!$(rootaccordion).hasClass("l-accordion-panel"))                $(rootaccordion).addClass("l-accordion-panel");            var selectedindex = 0;            if ($("> div[1selected=true]", rootaccordion).length > 0)                selectedindex = $("> div[1select=true]", rootaccordion).index();            $(">div", rootaccordion).each(function (index, item) {                var header = $('<div class="l-accordion-header"><div class="l-accordion-toggle"></div><div class="l-accordion-header-inner"></div></div>');                //添加头部样式                if (index == selectedindex)                    $(".l-accordion-toggle", header).addClass("l-accordion-toggle-open");                else                    $(".l-accordion-toggle", header).addClass("l-accordion-toggle-close");                $(item).before(header);                if ($(item).attr("title")) {                    $(".l-accordion-header-inner", header).html($(item).attr("title"));                    $(item).attr("title", "");                }                //没有定义内容样式则加入                if (!$(item).hasClass("l-accordion-content"))                    $(item).addClass("l-accordion-content");                    //                 $("[class*=l-accordion-toggle-close]", header).each(function(){//                   //                    $(this).next(".l-accordion-content").hide();//                 //                 })                                 if ($("[class*=l-accordion-toggle-close]", header).length>0)                      $(item).hide();                          });//end each                        if(options){                                if(options.height){                   rootaccordion.height(options.height);                 }            }                       $(".l-accordion-header",rootaccordion).hover(function ()            {                $(this).addClass("l-accordion-header-over");            }, function ()            {                $(this).removeClass("l-accordion-header-over");            });                        $(".l-accordion-toggle",rootaccordion).hover(function(){                 if($(this).hasClass("l-accordion-toggle-open"))                      $(this).addClass("l-accordion-toggle-open-over");                  if($(this).hasClass("l-accordion-toggle-close"))                      $(this).addClass("l-accordion-toggle-close-over");                                         },function(){                              if($(this).hasClass("l-accordion-toggle-open"))                      $(this).removeClass("l-accordion-toggle-open-over");                  if($(this).hasClass("l-accordion-toggle-close"))                      $(this).removeClass("l-accordion-toggle-close-over");            });                                  //点击菜单                  $(">.l-accordion-header",rootaccordion).click(function(){                                             var tiggerbtn=$(".l-accordion-toggle:first",this);               //               if(tiggerbtn.hasClass("l-accordion-toggle-open"))               {                   tiggerbtn.removeClass("l-accordion-toggle-close-over l-accordion-toggle-open-over")                   .removeClass("l-accordion-toggle-open");                   tiggerbtn.addClass("l-accordion-toggle-close");                   $(this).next(".l-accordion-content").hide();               }               else{                   tiggerbtn.removeClass("l-accordion-toggle-close-over l-accordion-toggle-open-over")                   .removeClass("l-accordion-toggle-close");                   tiggerbtn.addClass("l-accordion-toggle-open");                   $(this).next(".l-accordion-content").show().siblings(".l-accordion-content:visible").hide();               }                                                         });                                },        preRender: function () {        },        rended: function () {        }    }); })(jQuery);$(function(){   $("[type=extui-accordion]").accordion();});