JavaScript手風琴幫助切換第一個元素有效

Question

請求快速幫助。爲我的手風琴得到了這個JS。這是現在完整的腳本。 QN：如何修改JS以使我的第一個面板元素在加載頁面時處於活動狀態或展開狀態，但在點擊時切換（因爲它已經存在）？

在此先感謝。

var acc = document.getElementsByClassName("accordion"); 
 
    var i; 
 
    
 
    
 
    for (i = 0; i < acc.length; i++) { 
 
     acc[i].onclick = function() { 
 
     this.classList.toggle("active"); 
 
     var panel = this.nextElementSibling; 
 
     if (panel.style.maxHeight){ 
 
      panel.style.maxHeight = null; 
 
     } else { 
 
      panel.style.maxHeight = panel.scrollHeight + "px"; 
 
     } 
 
     } 
 
    } 
 

.panel {overflow:hidden;max-height:0}

 <button class="accordion">Section 1</button> 
 
    <div class="panel">My Content 1</div> 
 

 
    <button class="accordion">Section 2</button> 
 
    <div class="panel">My Content 2</div>

希望腳本現在可以運行。

Answer 1

我希望它會幫助你在這裏，我只是觸發第一手風琴的點擊功能

var acc = document.getElementsByClassName("accordion"); 
 
    
 
    var i; 
 
    
 
    
 
    for (i = 0; i < acc.length; i++) { 
 
     acc[i].onclick = function() { 
 
     this.classList.toggle("active"); 
 
     var panel = this.nextElementSibling; 
 
     if (panel.style.maxHeight){ 
 
      panel.style.maxHeight = null; 
 
     } else { 
 
      panel.style.maxHeight = panel.scrollHeight + "px"; 
 
     } 
 
     } 
 
    } 
 
    acc[0].click(); 
 

 

.panel {overflow:hidden;max-height:0}

 <button class="accordion">Section 1</button> 
 
    <div class="panel">My Content 1</div> 
 

 
    <button class="accordion">Section 2</button> 
 
    <div class="panel">My Content 2</div>

Answer 2

您可以使用下面的代碼，當您加載或你的手風琴菜單後創建

var acc = document.getElementsByClassName("accordion"); 
acc[0].classList.toggle("active");