单击按钮,然后在可折叠的手风琴中制作Div隐藏



单击重复按钮

,在网站上崩溃了一个重复的手风琴

i有一个远程按钮,(使用"面板默认"one_answers"面板折叠"类Bootstrap 3(在同一页面中重复几次。在此手风琴按钮下,还有另一个按钮,在同一页面中也重复了几次。当我单击一个特定的按钮时,我希望它通过jQuery折叠在其上方的特定手风琴。


<div class="panel panel-default">
    <div class="panel-heading accordion-toggle question-toggle " data-toggle="collapse" data-parent="#faqAccordion" data-target="#infoAccordion" aria-expanded="false">
       <h4 class="panel-title">Edit Info</h4>
    </div>
    <div id="infoAccordion" class="panel-collapse collapse in" style="" aria-expanded="false">
         <div class="panel-body">
             some info
         </div>
    </div>
</div>
<div class="col-md-12  col-sm-12  col-xs-12 text-right pan">   
    <button class="nochg-btn">No Change</button>                
</div>

我已经尝试过:

$(document).ready(function(){
        $(".nochg-btn").click(function(){
          $(this).siblings(".panel-collapse").collapse("hide");
        });
    });

也:

$(document).ready(function(){
        $(".nochg-btn").click(function(){
          $(this).parent().siblings(".panel-default").addClass("collapsed");
          $(this).parent().children(".panel-collapse").removeClass("collapse");
          $(this).parent().children(".panel-collapse").removeClass("in");
        });
    });

和:

$(document).ready(function(){
        $(".nochg-btn").click(function(){
          $(event.target).closest('.panel-default').find('.panel-collapse').addClass("collapse");
          $(event.target).closest('.panel-default').find('.panel-collapse').addClass("in");
        });
    });

无济于事。如果有人可以帮助我检测出jQuery中的问题,我将非常感谢它!!!

     <script>
          $(document).ready(function(){
            $(".nochg-btn").click(function(){
               $(this).parents('.root').find(".panel-collapse").collapse("hide");
            });
        });
        </script>
        <div class="root">
    <div class="panel panel-default">
    <div class="panel-heading accordion-toggle question-toggle " data-toggle="collapse" data-parent="#faqAccordion" data-target="#infoAccordion" aria-expanded="false">
       <h4 class="panel-title">Edit Info</h4>
    </div>
    <div id="infoAccordion" class="panel-collapse collapse in" style="" aria-expanded="false">
         <div class="panel-body">
             some info
         </div>
    </div>
    </div>
<div class="col-md-12  col-sm-12  col-xs-12 text-right pan">   
    <button class="nochg-btn">No Change</button>                
</div>
</div>

<div class="root">
    <div class="panel panel-default">
    <div class="panel-heading accordion-toggle question-toggle " data-toggle="collapse" data-parent="#faqAccordion" data-target="#infoAccordion" aria-expanded="false">
       <h4 class="panel-title">Edit Info</h4>
    </div>
    <div id="infoAccordion" class="panel-collapse collapse in" style="" aria-expanded="false">
         <div class="panel-body">
             some info
         </div>
    </div>
    </div>
<div class="col-md-12  col-sm-12  col-xs-12 text-right pan">   
    <button class="nochg-btn">No Change</button>                
</div>
</div>

最新更新