jQuery - 手风琴盒

Question

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

如何使用jQuery实现这一目标？我想也许我可以使用Accordion插件，但听起来它只适用于列表显示。

示例：

Box Title
查看更多！

*用户点击

方块标题

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

关闭

Answer 1

jQuery UI Accordion plugin不依赖于列表，您可以使用这样的标记：

<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/查看主题标签，它不使用列表。