[英]How to collapse all the nested Accordions if clicked on its parent Accordion?
这是我的jsfiddle
单击父项后,然后展开其下的嵌套手风琴。
最后,如果再次单击“父级”,那么如何关闭该目录下当前存在的所有嵌套手风琴?
这是我创建手风琴的方法:
$("div.accordian").accordion({
heightStyle: "content",
autoHeight: false,
collapsible: true,
clearStyle: true,
active: false,
});
$("div.accordian").accordion({
activate: function (event, ui) {
createAccordian(event, ui);
}
});
function createAccordian(activateEvent, activateUi) {
var selectedeleemnt = activateUi.newHeader.text();
if (selectedeleemnt != null && activateUi.newPanel.html() == '') {
//do stuff to laod html here and then replace html below
activateUi.newPanel.html(" \
<h3><a href='#'>Child1</a></h3> \
<div></div> \
<h3><a href='#'>Child2</a></h3> \
<div></div> \
<h3><a href='#'>Child3</a></h3><div>This doesn't have dynamic loaded accordion, just content</div>")
.accordion({
heightStyle: "content",
autoHeight: false,
collapsible: true,
active: false,
activate: function (event, ui) {
createAccordian(event, ui);
}
});
}
}
单击父级时,只需在手风琴的子标题上触发click
事件。
演示: http : //jsfiddle.net/lotusgodkk/DBYLk/21/
$(document).on('click', '.ui-accordion-header', function () {
$(this).next('.ui-accordion-content:first').find('.ui-accordion-header-active').trigger('click');
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.