jQuery手风琴盒

Question

我在表单上有一系列的框/内容块，只需要显示框的标题，下面有一个“查看更多”按钮。当用户单击“查看更多”时，框应垂直展开以显示其内容。另外，当单击另一个“查看更多”时，任何其他打开的框都需要关闭。

如何使用jQuery完成这一任务？我想也许我可以使用手风琴插件，但听起来它只适用于列表显示。

示例：

方框标题

再看一遍！

*用户点击

方框标题

• 内容
• 内容
• 内容
• 内容

关

Answer 1

jQuery UI手风琴插件不依赖于列表，您可以使用如下标记：

<div id="accordion">
  <h3><a href="#">First header</a></h3>
  <div>First content</div>
  <h3><a href="#">Second header</a></h3>
  <div>Second content</div>
</div>

Answer 2

http://jqueryui.com/demos/accordion/查看主题选项卡，它不使用列表。