我不擅长于JavaScript,所以如果任何人都可以帮助我,我将非常感激。有效/无效Jquery导航菜单
我有一个简单的列表是这样的:
<ul>
<li id="nav1">Menu 1</li>
<li id="nav2">Menu 2</li>
<li id="nav3">Menu 3</li>
</ul>
当我想一个菜单元素上的用户点击添加一个类“menu_active”。
我可以用这个代码达到这样的结果:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("#nav1").toggle(function() {jQuery(this).addClass("menu_active");},function() {jQuery(this).removeClass("menu_active");});
jQuery("#nav2").toggle(function() {jQuery(this).addClass("menu_active");},function() {jQuery(this).removeClass("menu_active");});
jQuery("#nav3").toggle(function() {jQuery(this).addClass("menu_active");},function() {jQuery(this).removeClass("menu_active");});
});
</script>
脚本的工作,但如果你点击#NAV1,然后#NAV2,然后#nav3,所有这三个项目将有类“ menu_active”。
是否有简单的方法只有一个菜单元素突出显示?
将三个菜单中的menu_active类添加到刚才单击的类中,然后删除它们。 –