Bootstrap-Kollaps benötigt zwei Klicks zum Öffnen auf einer Joomla-Site

Question

In dieser Joomla-Seite http://185.25.22.156/petshop.gr/index.php/blog müssen Sie zunächst zweimal die Schaltfläche "Mehr anzeigen" drücken, um das Bootstrap-Kollaps-Plugin anzuzeigen, um den reduzierbaren Inhalt anzuzeigen. Dann funktioniert die Schaltfläche (zeigen/verstecken Sie den reduzierbaren Inhalt) mit einem Klick, wie es sollte.

Hier ist meine Joomla-Artikel html

<div class="container"> 
    <h1 class="category">Blog 
     <button type="button" class="btn-arrow" data-toggle="collapse" data-target="#subcategory">Show More 
      <span class="glyphicon glyphicon-chevron-down"></span></button> 
    </h1> 
    <div id="subcategory" class="container collapse"> 
     <div id="subcategories"> 
      <div class="row" style="margin: 30px 0 0 0;">More content</div> 
     </div> 
    </div> 
</div> 



<script>  
    $jq1('#subcategory').on('hidden.bs.collapse', function() { 
     $jq1(".btn-arrow").html('Show More <span class="glyphicon glyphicon-chevron-down"></span>'); 
    }); 
    $jq1('#subcategory').on('shown.bs.collapse', function() { 
     $jq1(".btn-arrow").html('Show Less <span class="glyphicon glyphicon-chevron-up"></span>'); 
    }); 
</script> 

Jede Hilfe sehr geschätzt wird !!!

Answer 1

Wenn Sie zum ersten Mal zu klicken als dieses Attribut auf den So wird

aria-expanded="false" 

Schaltfläche hinzugefügt wird das div kollabiert, wenn erweitert. Wenn Sie zum zweiten Mal klicken, wird

aria-expanded="true" 

Das div wird erweitert, wenn es minimiert ist. Nur wenn es wahr wird, wird das div erweitert. Sie müssen überprüfen, welches Javascript dieses zusätzliche Attribut hinzufügt. Sie müssen den ersten Klick wahr und den zweiten falsch machen.