Как вызвать Аккордеон при нажатии кнопки в jQuery?

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"
});

Вы можете проверить это в этой скрипке .

РЕДАКТИРОВАТЬ: Аккордеон может быть не лучшим выбором, чтобы свернуть диалог к ​​его названию, особенно если вы хотите, чтобы кнопка вызывала эффект. Может быть, вы можете просто использовать slideToggle () вместо:

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

Обновленная скрипка здесь .