如何在jQuery中单击一个Button时触发Accordion？

Question

当我点击最小化按钮或更具体时，我想触发手风琴，当我们点击最小化按钮时，对话框的内容部分会被隐藏。

Html代码：

<div id="dialog" title="Title">
<div>
<p>Some Content</p>
</div>
</div>
<button>Minimize</button>

脚本代码：

$(function (){
$("#dialog").dialog();
$("button").button({icons:{primary: "ui-icon-minus"},text: false}).insertBefore('.ui-dialog-titlebar-close').click(function(){ 
$("#dialog").accordion({collapsible: true});
});
});

Answer 1

您需要在对话框小部件而不是原始<div>元素上触发手风琴。您还需要将标题栏明确指定为折叠标题：

$("#dialog").dialog("widget").accordion({
    collapsible: true,
    header: "> .ui-dialog-titlebar"
});

您可以在this fiddle中进行测试。

编辑：手风琴可能不是将对话框折叠到其标题的最佳选择，尤其是如果您只想让按钮触发效果。也许您只能使用slideToggle()：

$("#dialog").slideToggle("fast");

更新了小提琴here。