在jQuery中单击兄弟节点时从当前div中删除活动类

Question

当我active点击任何兄弟div时,我试图从当前div中删除该类.出于某种原因,我的情况并不适用.

下面是我的HTML和JS

(注意,部分问题已被选中,并且处于活动状态).

<div class="question">
    <div class="views-field views-field-title views-accordion-header ui-accordion-header ui-state-default ui-corner-all ui-accordion-icons" role="tab" id="ui-id-9" aria-controls="ui-id-10" aria-selected="false" aria-expanded="false" tabindex="-1">
        <span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>
            <a href="#q_as-page-4">        
                <span class="field-content">Ex Valde </span>  
            </a>
    </div>  
    <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" id="ui-id-10" aria-labelledby="ui-id-9" role="tabpanel" aria-hidden="true" style="display: none; height: 643.801979064941px;">
        <div class="views-field views-field-body">        
            <div class="field-content">Blandit immitto iusto natu praesent turpis. Dolore duis ideo meus nimis venio vulpes. At autem commodo dignissim interdico mos vel. Eros letalis nobis quia secundum. Decet metuo neque. Causa incassum lobortis pecus quadrum qui tamen.</div>  
        </div>
    </div>  
</div>


<div class="question active">

  <div class="views-field views-field-title views-accordion-header ui-accordion-header ui-state-active ui-corner-all ui-accordion-icons" role="tab" id="ui-id-11" aria-controls="ui-id-12" aria-selected="false" aria-expanded="false" tabindex="-1">
    <span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>
        <a href="#q_as-page-5">        
            <span class="field-content">Cogo Ibidem Persto Zelus </span>  
        </a>
  </div>  
  <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" id="ui-id-12" aria-labelledby="ui-id-11" role="tabpanel" aria-hidden="true" style="display: none; height: 643.801979064941px;">
    <div class="views-field views-field-body">        
        <div class="field-content">Eu hendrerit pala ulciscor. Exputo gilvus tincidunt. Exputo nutus obruo paulatim secundum tation torqueo. Defui esse ille iriure lucidus mauris roto.
        </div>  
    </div>
  </div>  
</div>


<div class="question">

  <div class="views-field views-field-title views-accordion-header ui-accordion-header ui-state-default ui-corner-all ui-accordion-icons" role="tab" id="ui-id-13" aria-controls="ui-id-14" aria-selected="false" aria-expanded="false" tabindex="-1">
    <span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>
        <a href="#q_as-page-6">        
            <span class="field-content">Cogo Ibidem Persto Zelus </span>  
        </a>
  </div>  
  <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" id="ui-id-14" aria-labelledby="ui-id-13" role="tabpanel" aria-hidden="true" style="display: none; height: 643.801979064941px;">
    <div class="views-field views-field-body">        
        <div class="field-content">Eu hendrerit pala ulciscor. Exputo gilvus tincidunt. Exputo nutus obruo paulatim secundum tation torqueo. Defui esse ille iriure lucidus mauris roto.
        </div>  
    </div>
  </div>  
</div>

JS

$('.question .ui-state-default a').on("click", function(e) {

    //$(this).parent().parent().closest('div[class=active]').removeClass("active");;
    //$(this).parent().parent().parent().removeClass("active");
    $(this).parent().parent().addClass("active");
});

Answer 1

试试这个:

    $('.question .ui-state-default a').on("click", function(e) {
      $(".question").removeClass("active");
      $(this).parent().parent().addClass("active");
    });