javascript - 带按钮的 Bootstrap 面板 - 崩溃问题

Question

这是我的代码:

<div class="panel panel-default">
    <div class="panel-heading clearfix" role="tab" id="heading-details" data-toggle="collapse" data-target="#details" data-parent="#panel-group" href="#details">
       <h4 class="panel-title pull-left">My panel title</h4>

       <a class="btn btn-primary btn-sm pull-right" asp-action="Action">
            <span class="glyphicon glyphicon-pencil"></span>
        </a>
    </div>
    <div id="details" class="panel-collapse collapse" role="tabpanel">
        <div class="panel-body">
            @Html.Partial("_DetailsPartial", Model)                
        </div>
    </div>
</div>

问题:

当我单击按钮链接时，面板主体展开/折叠。我不想在单击按钮时切换面板主体。

如何关闭按钮上的数据切换？

提前致谢

Answer 1

这是我所做的:

• 向按钮添加类“disable-collapse”
• 在下面添加了脚本

$('.disable-collapse').click(function (e) 
{ event.stopPropagation(); })

有了这个，当我点击面板标题时面板主体会切换，但当我点击按钮时不会切换。