試圖使用JavaScript下拉菜單，它不工作？

我真的很新的JavaScript，但據我所知，我在這裏的代碼應該工作。沒有錯誤來，當我在控制檯視圖（沒有出現這個問題），並且在網站上出現的所有的按鈕不會做任何事情，已經出現在頁面試圖使用JavaScript下拉菜單，它不工作？

<html> 
<body> 
<nav> 
<ul> 
    <li> 
    <button class="accordion">Collections</button> 
    <ul class="dropDown"> 
     <li><p>Mojica Lookbook</p></li> 
     <li><p>Andrade Editorial</p></li> 
     <li><p>Bell Videos</p></li> 
    </ul> 
    </li> 
    <li> 
    <a href="shop.html">Shop</a> 
    </li> 
    <li> 
    <a href="stores.html">Stores</a> 
    </li> 
    <li> 
    <a href="contact.html">Contact</a> 
    </li> 
    <li> 
    <img src="mojica_lookbook/mojica_credits.png" class="credits"> 
    </li> 
</ul> 
</nav> 
</body> 

    <script> 

     var dropDown = document.getElementsByClassName("dropDown"); 
     var i = 0; 

     for(i = 0; i < dropDown.length; i++) { 
     dropDown[i].onclick = function(){ 
      this.classList.toggle("active"); 
      this.nextElementSibling.classList.toggle("show"); 
     } 
     } 
     </script> 

    </html>

來源

2016-08-04 ashumway

在列表項我相信你需要使用傳遞給onclick回調的元素。而不是使用回調中的「這個」關鍵詞試試這個：

for(i = 0; i < dropDown.length; i++) { 
    dropDown[i].onclick = function(e){ 
    e.target.classList.toggle("active"); 
    e.target.nextElementSibling.classList.toggle("show"); 
    } 
}

有幾個例子here。至於按鈕，你還沒有映射一個點擊事件，所以，你會解釋什麼也不做。

來源

2016-08-04 22:17:40

試圖使用JavaScript下拉菜單，它不工作？

回答

相關問題