jQuery UI手风琴故障（可折叠）

Question

再次遇到jQuery问题 - 这一次，我需要一个可折叠的手风琴用于导航。

当我点击“工作”时，我想打开列表。我目前使用的示例here中使用了相同的jquery。

现在，我只是试图让它工作......但我希望它默认为折叠，因此它可以打开。不知道如何做那部分。

这里有一个小提琴：http://jsfiddle.net/bG52W/

的HTML

<ul class="accordion"> 
<li><a href="#"><h1>work</h1></a></li> 
    <ul class="nav"> 
    <li><a href="#section1"><p class="nav_p">anatomy of type</p></a></li> 
    <li><a href="#section2"><p>clash album redesign</p></a></li> 
    <li><a href="#section3"><p>"ghost" book jacket</p></a></li> 
    <li><a href="#section4"><p>charlie chaplin</p></a></li> 
    <li><a href="#section5"><p>design influence</p></a></li> 
    <li><a href="#section6"><p>"thrift thoughts" zine</p></a></li> 
    <li><a href="#section7"><p>cigarette card illustration</p></a></li> 
    <li><a href="#section8"><p>"frosty" winecooler packaging</p></a></li> 
    </ul> 

<li><a href="#"><h1>about</h1></a></li> 

<li><a href="#"><h1>contact</h1></a></li> 
</ul> 

jQuery的

$(function() { 
    $("#accordion").accordion({ 
     collapsible: true 
    }); 
    }); 

任何和所有帮助表示赞赏！

Answer 1

http://jsfiddle.net/bG52W/3/

即使所有的代码是正确的。它从来不会在jfiddle中工作。你没有检查左边的jQuery UI。

除此之外，你的结构是一个有点不对劲：

你的手风琴容器的标记需要头对和 内容面板：

http://api.jqueryui.com/accordion

<div class="accordion"> 
<h1><a href="#">work</a></h1> 
    <div class="nav"> 
     <ul> 
    <li><a href="#section1"><p class="nav_p">anatomy of type</p></a></li> 
    <li><a href="#section2"><p>clash album redesign</p></a></li> 
    <li><a href="#section3"><p>"ghost" book jacket</p></a></li> 
    <li><a href="#section4"><p>charlie chaplin</p></a></li> 
    <li><a href="#section5"><p>design influence</p></a></li> 
    <li><a href="#section6"><p>"thrift thoughts" zine</p></a></li> 
    <li><a href="#section7"><p>cigarette card illustration</p></a></li> 
    <li><a href="#section8"><p>"frosty" winecooler packaging</p></a></li> 
     </ul> 
    </div> 
<h1><a href="#">about</a></h1> 
    <div><a href="#"><h1>about</h1></a></div> 
<h1><a href="#">contact</a></h1> 
    <div><a href="#"><h1>contact</h1></a></div> 
</div> 

而且就像声音说的那样，你的选择器是错误的。

$(function() { 
    $(".accordion").accordion({ 
     collapsible: true 
    }); 
}); 

Answer 2

首先你的选择器$（“#accordion”）是错误的。应该是$（ ​​“.accordion”）