$1.collapse、$1.expand

HTML 代码

<div id="title1" class="title" style="cursor:default;">单击我</div> <div id="content1" class="content" style="background-color:red;color:#fff;"> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> </div> <div id="title2" class="title" style="cursor:default;">单击我</div> <div id="content2" class="content" style="background-color:green;color:#fff;"> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> </div> <div id="title3" class="title" style="cursor:default;">单击我</div> <div id="content3" class="content" style="background-color:blue;color:#fff;"> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> <div>www.getezj.com</div> </div>

JavaScript 代码（ezj 代码）

ezj.ready(function(){ var titles = $(".title"); var contents = $(".content"); titles.each(function(e, index){ e.click(function(e){ for (var i = 0; i < titles.length; i++) { if (i != index) { contents[i].collapse(20, 10); } else { contents[i].expand(20, 10); } } }); }); contents.each(function(e, index){ if (index != 0) { e.collapse(); } }); });

演示