Bootstrap panel-collapse 事件触发不止一次答案

【问题标题】：Bootstrap panel-collapse event triggers more than onceBootstrap panel-collapse 事件触发不止一次
【发布时间】：2015-08-27 02:50:31
【问题描述】：

我有以下代码用于商店中可用的产品以及相关产品。我想在崩溃事件中获得div 的id。但是从代码中我在折叠嵌套列表时得到了两个触发结果。

HTML

<a data-toggle="collapse" data-parent="#accordion" href="#collapse1">
    <font style="color: black;"><b>Product List</b></font>
</a>
<div id="collapse1" class="panel-collapse collapse in">
<div class="accordion">
    <a data-toggle="collapse" data-parent="#accordion" href="#collapse2">  
        <b>Product1</b>
    </a>
</div>          
<div id="collapse2" class="panel-collapse collapse in">
       Product1 Description
        <br/>
        <a data-toggle="collapse" data-parent="#accordion" href="#collapse3">
                <b>Related Products</b>
        </a>                                                            
        <div id="collapse3" class="panel-collapse collapse in">                     
               Related Product2 
               <br/>Related Product3                                                                
        </div>
    </div>
</div>

javascript

$('.collapse').on('show.bs.collapse', function (e) {
    if ($(this).hasClass("in")) {
        console.log('id:'+e.currentTarget.id);
    }                           
})

当我得到以下结果时：关于产品1 输出=>

id:collapse1

关于相关产品 输出=>

id:collapse2
id:collapse1

如何从第二个结果（仅限id: collapse2）中获取单个结果，因为它显示了两个触发结果。我在其他地方做错了吗？

【问题讨论】：

标签： twitter-bootstrap collapse

【解决方案1】：

我已经解决了这个问题。我修改了js事件函数如下，即使它不需要任何$(this).hasClass("in")检查。

$(document).on('show.bs.collapse', function (e) {        
    console.log('id:'+e.target.id);                                   
})

【讨论】：