2016-12-09 4 views
0

내가이 일을 올바르게 수행하고 있는지 확실하지 않습니다. 열기와 닫기 사이를 전환하는 메뉴가 있습니다. 메뉴가 hasClass("open"); 인 경우 이제 버튼을 표시하고 싶습니다. 일단 class open이 사라지면 수업을 삭제하고 싶습니다.요소에 클래스 추가 클래스가있는 경우

다음은 HTML 부분입니다. 그래서 이것은 중요하지 않습니다

<nav> 
    <a class="closed"><i class="fa fa-bars"></i>Menu</a> 
     <ul> 
      <li>Menu items</li> 
     </ul> 
    <div class="close-btn"> 
     <i class="fa fa-times" aria-hidden="true"></i> 
    </div> 
</nav> 

하는 HTML 작품, 중요한 부분은 요소가 있다는 것입니다 : nav, a, closed.

이제 jQuery 부분을 참조하십시오.

$(document).ready(function(jQuery) { 
    if ($("nav a").hasClass("open")) { 
     $(".close-btn").addClass('show-me-the-button'); 
    } else { 
     $(".close-btn").removeClass('show-me-the-button'); 
    } 
}); 

그러나 이것은 작동하지 않습니다. 나는 stackoverflow를 검색했지만 모두이 코드를 주었다 ... 왜 작동하지 않는지 확실하지 않다. 스크립트 오류가 발생했습니다 ... 어떤 도움이 필요합니까?

+2

메뉴의'open' /'close' 클래스를 토글하는 이벤트 핸들러 내에서 코드를 실행해야합니다. –

+2

HTML에'.close-btn' 클래스의 요소가 없습니다. – connexo

+0

여기에 더 많은 정보가 필요합니다. 편집하십시오. 항목을 클릭하거나 페이지를로드 할 때만 열거 나 닫으려고합니까? 변경 될 때 "감지"하려고합니까? 이 경우 다른 유형의 이벤트를 만들어야합니다. –

답변

3

초기 페이지로드시에만 클래스를 확인하십시오. open 클래스는 어디에서 변경합니까? 그 장소에서이 코드를 옮겨야합니다. -

1

사용자 오룔은 다음과 같이 핸들러 내부에 코드를 넣어

시도 올바른 :

$(document).ready(function(jQuery) { 

    $('nav a').on('click', function(e) { // <----------- Click Handler (jQuery) 

     // Use $(this) to access current clicked element 
     if ($(this).hasClass("open")) { 
      $(".close-btn").addClass('show-me-the-button'); 
     } else { 
      $(".close-btn").removeClass('show-me-the-button'); 
     } 

    }) 

}); 

이 도움이 더 약 Click Handler in jQuery

희망을 참조하십시오!

관련 문제