jQuery手风琴 - OnCollapse和OnExpand事件

Question

我有一个像这样的单一标题的手风琴

<div class="accordion" id="accordion_acquired_services">
    <h3><a href="#">Acquired services</a></h3>
    <table id="tbl_acquired_services">
        <tbody></tbody>
    </table>
</div>

我想要的是将手风琴开放和手风琴的活动结合起来......

实际上我想要实现的是做一个ajax请求,每次扩展时都会填充手风琴的内容......

奇怪的是,没有onExpand/onCollapse事件

到目前为止,我有这个

$( "#accordion_acquired_services" ).bind( "accordionchange", function(event, ui) {   
    $('#tbl_acquired_services').html('');
    //trigger ajax
});

但是这种情况在两种情况下都会触发,当它崩溃并且它被扩展时......我怎么知道哪个是哪个？

Answer 1

时间变化,jquery也是如此.从线程复制/粘贴

$("#accordion").accordion({ activate: function(event, ui) {
          alert(ui.newHeader.text());
  }
});

另一件事:

   $("#accordion").accordion({ beforeActivate: function(event, ui) {
        alert(ui.newHeader.text());         
     }
  });

有关更多详细信息,请查看jQuerys文档

Answer 2

这里有2个代码要注意

1.显示 2.显示 3.隐藏 4.隐藏

所以代码如下

$('#accordion').on('show.bs.collapse', function () {
 //on clicking the accordion menu
});

$('#accordion').on('hide.bs.collapse', function () {
 //on clicking the accordion menu
});

所以现在如果我们使用隐藏和显示我们可以在手风琴菜单内容关闭或完全打开后触发

$('#accordion').on('shown.bs.collapse', function () {
 //after menu opens
});

$('#accordion').on('hidden.bs.collapse', function () {
 //after menu closes
});

Answer 3

尝试这个解决方案：

var opened = $(this).find('.ui-state-active').length;