跨度折叠在随机点击时不起作用

Question

这是我的代码：-

<div class="panel-heading" role="tab" id="headingOne${count}" data-toggle="collapse" data-parent="#accordion" href="#collapseOne${count}" aria-expanded="true" aria-controls="collapseOne${count}">
                    <h4 class="row panel-title">
                        <span class="col-md-5 col-lg-5 accordian-filegroupname">${fileGrp}</span> 
                        <span class="col-md-3 col-lg-3 accordian-filegroupeye">( Eye: ${getEyeTypeFromFileName(fileGrp)} )</span>
                        <span class="col-md-3 col-lg-3 accordian-filegroupeye">( Uploaded On: ${parentUploadedOn} )</span>
                        <span class="col-md-1 col-lg-1 accordian-filegroupicon"><i class="accordion_icon fa fa-plus"></i></span>
                    </h4>
                </div>

和下面是jQuery脚本：-

$('.panel-heading').click(function () {
       $(this).find('i').toggleClass('fa-plus fa-minus')
           .closest('panel').siblings('panel')
           .find('i')
           .removeClass('fa-minus').addClass('fa-plus');
   });

当用户单击UI上的加号以进行折叠时，它工作正常，但是当用户随机快速单击UI时，有时加号会变成负号，反之亦然。我要在折叠时保持减号，而在随机快速单击时不折叠时保持加号]

Answer 1

您需要使其简单：

$('.panel-heading').click(function () {
    $('i').removeClass('fa-minus').addClass('fa-plus');
    $(this).find('i').toggleClass('fa-minus');
});

该函数的第一行将删除fa-plus类，并将fa-minus添加到所有<i>，然后，第二行将fa-minus类仅添加到单击的div的子级<i>。

请尝试一下。这应该可以。