改变儿童手风琴指示器图标twitter bootstrap

Question

我有两个级别的Twitter bootstrap手风琴和下拉指示器图标。 问题是，当我关闭子组时，指标也会在父级中发生变化。 （抱歉我的英语不好）

$('.accordion-body').on('show', function() {
   $(this).siblings('.accordion-heading').children('.ui-icon').removeClass('ui-icon-triangle-1-e').addClass('ui-icon-triangle-1-s');
});

$('.accordion-body').on('hide', function() {
   $(this).siblings('.accordion-heading').children('.ui-icon').removeClass('ui-icon-triangle-1-s').addClass('ui-icon-triangle-1-e');
});

JSfiddle

Answer 1

嗯，这是非常模糊的，但这是原因：默认情况下“show”和“hide”事件会冒泡，因此在子可折叠中触发的hide / show事件也会被父级可折叠事件捕获。 / p>

解决方案是以这种方式调整听众：

$('.accordion-body').on('show', function(e) {
    e.stopPropagation();
    …
}

这是你小提琴的工作版本：http://jsfiddle.net/HwNYB/2/。

旁注：

e.stopPropagation(); 

有IE对应物：

e.cancelBubble = true;