如何通过菜单循环和删除类,然后添加类当前菜单项
-
19-09-2019 - |
题
我有用于通过内容滑块面板导航此菜单结构。
<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>
我想通过这些元件环和删除突出显示类,然后高亮类添加到当前/最后点击菜单项。
任何想法?任何帮助,将不胜感激。
由于
乔纳森
解决方案
可以这样?
$('#menu li a').click(function(){
$('#menu li a').removeClass('highlight');
$(this).addClass('highlight');
});
其他提示
...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>
不隶属于 StackOverflow