自己实现一个简单的JQuery下的accordion

1.添加javascript代码：

//Design By Eric Xu 2008-5-28
function accordion(cz){
    this.prototype=create();
    function create(){
        $('dl.'+cz+' > dd').hide();
        $('dl.'+cz+' > dt').click(function(){
            var content = $(this).next();
            var others = content.parent().find("dd:visible");
            if (others.length&&others.html()!=content.html()){
                others.slideUp('fast', function() {
                    content.slideToggle('fast');
                });
            }else{content.slideToggle('fast');}
        });
    }
}

2.编写html代码：

<dl class="gaga">

    <dt>haha</dt>
    <dd>i am haha<br/><br/><br/><br/></dd>

    <dt>haha2</dt>
    <dd>i am haha2<br/><br/><br/><br/></dd>

</dl>

3.添加javascript代码

new accordion("gaga");

4.搞定啦。

感觉挺好使 大家快试试。

评论

2 楼 ericxu131 2008-05-29  

comasp 写道

呵呵 ，楼主的写法好像跟JQUERY的风格不太一样。

恩恩～对！写的时候没注意。

1 楼 comasp 2008-05-28  

呵呵 ，楼主的写法好像跟JQUERY的风格不太一样。