所有的手風琴排一次打開，如何解決？

Question

這個頁面使用了一個包含一個富文本元素的手風琴。 JS用於切換一個活動類，它可以改變其上的最大高度值，從而揭示內部的抽象內容。

我有一個問題，超鏈接不能在其中工作，因爲最大高度值是干擾;導致手風琴再次打開/關閉，而不是能夠瞄準文本（嘗試使用z-index，但似乎沒有辦法）。

我回到了JS和CSS文件中，以便將手風琴的標題定位爲一個單獨的類。這解決了超鏈接的問題，但現在，當我點擊其中一個手風琴時，所有手風琴都立即打開，這是以前沒有發生過的。

Image

標記

<div class="accordion-row"> 
@foreach (var item in Model.Items) { 
    <div class="teaser"> 
    <div class="teaser-title"> 
     @item.GetValue("title") 
    </div> 
     <div class="abstract"> 
      @Html.Raw(item.GetValue("content")) 
     </div> 
    </div> 
} 

腳本

var pullTeaser = $('.teaser-title'); 
    menuTeaser = $('.abstract'); 

$(pullTeaser).on('click', function(e) { 
     e.preventDefault(); 
     menuTeaser.toggleClass('slide'); 
     $(this).parent().toggleClass('active'); 
    }); 

Answer 1

試試這個

var pullTeaser = $('.teaser-title'); 
    menuTeaser = $('.abstract'); 

$(pullTeaser).on('click', function(e) { 
     e.preventDefault(); 
     $(this).parent().find(menuTeaser).toggleClass('slide'); 
     $(this).parent().toggleClass('active'); 
    });