메뉴를 반복하고 클래스를 제거한 다음 클래스를 현재 메뉴 항목에 추가하는 방법

콘텐츠 슬라이더 패널을 탐색하는 데 사용되는이 메뉴 구조가 있습니다.메뉴를 반복하고 클래스를 제거한 다음 클래스를 현재 메뉴 항목에 추가하는 방법

<div id="menu"> 
    <ul> 
    <li><a href="#1" class="cross-link highlight">Bliss Fine Foods</a></li> 
    <li><a href="#2" class="cross-link">Menus</a></li> 
    <li><a href="#3" class="cross-link">Wines</a></li> 
    <li><a href="#4" class="cross-link">News</a></li> 
    <li><a href="#5" class="cross-link">Contact Us</a></li> 
    </ul> 
</div>

이러한 요소를 반복하고 강조 표시 클래스를 제거한 다음 현재/마지막으로 클릭 한 메뉴 항목에 강조 표시 클래스를 추가하고 싶습니다.

아이디어가 있으십니까? 어떤 도움이라도 대단히 감사하겠습니다.

감사

조나단

출처

2010-03-14 Jonathan Lyon

그렇게 할 수 있습니까?

$('#menu li a').click(function(){ 
    $('#menu li a').removeClass('highlight'); 
    $(this).addClass('highlight'); 
});

출처

2010-03-14 06:58:14 edtsech

Jacob의 도움을 받아 코드를 추가 할 수있는 곳에서 도움을 주신 것에 감사드립니다. –

...your <head> and opening <body> tags... 
<div id="menu"> 
    <ul> 
    <li><a href="#1" class="cross-link highlight">Bliss Fine Foods</a></li> 
    <li><a href="#2" class="cross-link">Menus</a></li> 
    <li><a href="#3" class="cross-link">Wines</a></li> 
    <li><a href="#4" class="cross-link">News</a></li> 
    <li><a href="#5" class="cross-link">Contact Us</a></li> 
    </ul> 
</div> 
<script type="text/javascript"> 
(function($) { 
$("#menu ul li a").click(function() { 
    $(this).parent().parent().filter('a').removeClass('highlight'); 
    $(this).addClass('highlight'); 
}); 
})(jQuery); 
</script> 
</body> 
</html>

출처

2010-03-14 06:57:27

감사합니다. 제이콥이 어떻게 메뉴에서 호출합니까? –

@Jonathan, 그냥 jQuery.ready 코드에 추가하면 모든 설정이 완료됩니다. –

@jacob - 죄송합니다. 제발 무언가를 용서해주십시오. 문법의 측면에서 이것을 헤더에 어떻게 추가 할 수 있는지 말씀해 주시겠습니까? –

메뉴를 반복하고 클래스를 제거한 다음 클래스를 현재 메뉴 항목에 추가하는 방법

답변

관련 문제