Bootstrap崩溃，扩展完成后回调

我的网页上有一个Bootstrap 折叠面板 。 我需要在转换完成后面板完全展开后执行一个函数。 我找到了这个示例，了解如何在面板折叠并添加hidden.bs.collapse时访问回调。 如何在“Bootstrap：collapse plugin”转换完成后触发JavaScript函数 。

但是，当应用.collapse.in类时，我似乎无法触发类似的代码。

 $('#collapseExample').on('.collapse.in', function(){ alert("hi"); }); 

我还发现这个代码使用promises在切换类后触发函数。 它应该等到所有动画完成。 toggleClass上的jquery函数完成了吗？ 这对我的问题似乎也不起作用。

所以我问： 崩溃function完成后如何触发function？

这段代码尝试了jQuery promise技术。 理想情况下，它会在面板完成扩展后添加类.red但会立即触发。 http://www.bootply.com/Vx9oeyYy03#

 $(document).on('click', '.btn', function(){ $('#collapseExample').collapse("toggle").promise().done(function () { $('.well').addClass('red'); }) }); 

Answer 1

您可以使用显示的事件处理程序 ，该处理程序将在动画完成后触发

 $('#collapseExample').on('shown.bs.collapse', function() { snippet.log("shown"); }).on('show.bs.collapse', function() { snippet.log("show"); }); 

       
 
 
 
  Collapsible Group Item #1  
 
 
 
 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. 
 
 
 
 
 
  Collapsible Group Item #2  
 
 
 
 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. 
 
 
 
 
 
  Collapsible Group Item #3  
 
 
 
 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.