Alle Akkordeonreihen auf einmal öffnen, wie zu reparieren?

Question

Diese Seite verwendet ein Akkordeon, in dem sich ein Rich-Text-Element befindet. JS wird verwendet, um eine aktive Klasse umzuschalten, die den Wert für die maximale Höhe ändert und den darin enthaltenen abstrakten Inhalt anzeigt.

Ich hatte ein Problem, bei dem Hyperlinks nicht funktionieren würden, weil der Wert für die maximale Höhe störend war; Das Öffnen/Schließen des Akkordeons wurde verursacht, anstatt den Text gezielt ansprechen zu können (versuchte es mit dem Z-Index, aber es schien nicht der Trick zu sein).

Ich ging zurück in die JS und CSS-Datei, um die Überschrift des Akkordeons als separate Klasse anzusprechen. Das hat das Problem mit den Hyperlinks gelöst, aber jetzt, wenn ich auf eines der Akkordeons klicke, öffnen sich alle gleichzeitig, was vorher nicht passiert ist.

Image

Das Markup

<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> 
} 

Script

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

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

Answer 1

versuchen, diese

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

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