使用下拉按钮防止手风琴折叠

Question

我有一个带有自举下拉按钮的手风琴，想要在点击下拉按钮时防止手风琴折叠。我是通过stackoverflow question完成的，但是没有下拉列表，在我的情况下它会返回：

  

未捕获RangeError：超出最大调用堆栈大小

我的手风琴：

<div id="protocols-accordion">

  <h6 id="header-<?php echo $pId;?>" class="protocol-header"> 

    <div class="dropdown protocol-buttons" id="protocol-buttons-<?php echo $pId; ?>">

        <button class="btn btn-default dropdown-toggle protocol-dropdown" onClick="preventCollapse(event)"
                type="button" id="contact-dropdown-<?php echo $cId; ?>" data-toggle="dropdown" aria-expanded="true">
            <i class="fa fa-bars"></i>
        </button>

        <ul class="dropdown-menu" role="menu" aria-labelledby="contact-dropdown-<?php echo $pId; ?>">
            <li role="presentation"><a role="menuitem" tabindex="-1" onClick="editProtocol(<?php echo $pId; ?>)">Edit...</a></li>
            <li role="presentation"><a role="menuitem" tabindex="-1" onClick="deleteProtocol(<?php echo $pId; ?>)">Delete...</a></li>
        </ul>

    </div>

  </h6>

  <div class="content">
      Some content
  </div>
</div>

使用Javascript：

window.preventCollapse = function(e) {
    e.stopPropagation();
    $('#protocols-accordion .ui-state-active .protocol-dropdown').trigger('click');
}

什么导致了这个错误，是否有解决方案？