как пройти через меню и удалить класс, а затем добавить класс в текущий пункт меню - PullRequest
Новая
       19

как пройти через меню и удалить класс, а затем добавить класс в текущий пункт меню

2 голосов
/ 14 марта 2010

У меня есть эта структура меню, которая используется для навигации по панелям слайдера контента. 

 <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>

Я бы хотел пройтись по этим элементам и удалить класс выделения, а затем добавить класс выделения в текущий / последний нажатый пункт меню.

Есть идеи? Любая помощь будет принята с благодарностью.

Спасибо

Jonathan

Ответы [ 2 ]

3 голосов
/ 14 марта 2010

Может быть так? 

$('#menu li a').click(function(){
  $('#menu li a').removeClass('highlight');
  $(this).addClass('highlight');
});
1 голос
/ 14 марта 2010 
...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>
...