手风琴修复（jQuery的）

Question

HTML

<h2 class="sec-title">one</h2> 
<div class="sec-content">content 1</div> 
<h2 class="sec-title">two</h2> 
<div class="sec-content">content 2</div> 

的jQuery：

$('.sec-content').hide(); 
$('.sec-title:first').addClass('active').next().show(); 

$('.sec-title').click(function(){ 
if($(this).next().is(':hidden')) { 
    $('.sec-title').removeClass('active').next().slideUp(); 
    $(this).toggleClass('active').next().slideDown(); 
} 
return false; 
}); 

...工程，但如果想使第二手风琴节上的页面加载主动什么？我该怎么改变？

感谢您的帮助

Answer 1

尝试改变您选择的第sec-title类的元素添加到行：

$('.sec-title:eq(1)').addClass('active').next().show(); 

这里是API documentation为:eq选择器。我认为它会做你想做的。它将选择与选择器匹配的第n个元素。请记住eq()是基于0的 - 因此:eq(1)正在选择具有sec-title类的第二项。

这里是我的小提琴，说明这一点：http://jsfiddle.net/7KdGn/1/

我希望这有助于！

Answer 2

您可以使用（jQuery UI的手风琴（http://docs.jquery.com/UI/Accordion），而不是另起炉灶。密切关注其active选项，然后你的代码将变得简化为简单

$(document).ready(function() { 
    $("#accordion").accordion({ active: 1 }); 
});​ 

看一看为例here