引导程序嵌套面板塌陷切换没有ID

Question

我不确定我要做的是可能的，但是这里是可能的。

我正在使用bootstrap 3.3.7我也在TFS工作通过单击"添加用户"或" block用户"或"临时用户"之类的项目生成的代码块

这些会根据每个人的用户帐户及其中的内容而添加。因此，请注意。我不能拥有ID =" unique_name"，因为自动生成的代码不知道如何处理。

这些是我一直在玩的示例。

没有ID但行不通http://jsfiddle.net/misschoh/10wk860x/2/

$('.panel-collapse').collapse({toggle: false});
$('body').on('click', '[data-toggle=collapse-next]', function (e) {
e.preventDefault();
// Try to close all of the collapse areas first
var parent_id = $(this).data('parent');
$(parent_id+' .panel-collapse').collapse('hide');
// ...then open just the one we want
var $target = $(this).parents('.panel').find('.panel-collapse');
$target.collapse('toggle');
});

具有ID和工作http://jsfiddle.net/misschohh/56gwtpdm/

 <!-- Here we insert another nested accordion -->
      <div class="panel-group" id="accordion2">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h4 class="panel-title"><a data-toggle="collapse" data-parent="#accordion2" href="#collapseInnerOne"> Collapsible Inner Group Item #1 </a></h4>
          </div>
          <div id="collapseInnerOne" class="panel-collapse collapse in">
            <div class="panel-body"> Anim pariatur cliche... </div>
          </div>
        </div>
        <div class="panel panel-default">
          <div class="panel-heading">
            <h4 class="panel-title"><a data-toggle="collapse" data-parent="#accordion2" href="#collapseInnerTwo"> Collapsible Inner Group Item #2 </a></h4>
          </div>
          <div id="collapseInnerTwo" class="panel-collapse collapse">
            <div class="panel-body"> Anim pariatur cliche... </div>
          </div>
        </div>
      </div>
      <!-- Inner accordion ends here --> 

这就是我要做的

但是，如果没有为每个面板折叠定义ID，我就无法弄清楚如何

带有ID，工作和功能与嵌套面板合适https://www.bootply.com/vllkd53dzb

有人知道这是否可能，有人可以将我指向使它工作的方向。

谢谢！

Answer 1

我必须解开并绑定面板，然后停止传播。

 $('#chevronVisitors').unbind('click').on("click", function (e) {
    e.stopImmediatePropagation();