js怎样跳页面后导航二级菜单还是是高亮状态

答案:1 悬赏:50 手机版

解决时间 2021-01-26 23:09

提问者网友：做自己de王妃
2021-01-26 00:41

最佳答案

五星知识达人网友：行路难
2021-01-26 01:27

实现这个效果需要CSS的配合，关键是用JS为当前点击对象添加高亮的样式，并移除其他对象的高亮样式。举例：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#nav li {float: left; width: 80px; text-align: center; list-style-type: none;}
.nav-active {background: #369;}
.nav-active a {color: #fff;}
</style>
</head>
<body>
<ul id="nav">
<li class="nav-active"><a href="javascript:;">首页</a></li>
<li><a href="javascript:;">导航一</a></li>
<li><a href="javascript:;">导航二</a></li>
<li><a href="javascript:;">导航三</a></li>
<li><a href="javascript:;">导航四</a></li>
</ul>
<script src="

<script>
$('#nav').find('li').click(function() {
// 为当前点击的导航加上高亮，其余的移除高亮
$(this).addClass('nav-active').siblings('li').removeClass('nav-active');
});
</script>
</body>
</html>

我要举报

如以上回答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息，可以点下面链接进行举报！

点此我要举报以上问答信息