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를 사용하여 메뉴를 드롭 다운하려고하는데 작동하지 않습니까?

답변

관련 문제