<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
<style>
.actived {
background: red;
}
.noactive {
background:;
}
</style>
<ul id="menu">
<li> <a href="#">Menu1</a></li>
<li> <a href="#">Menu2</a></li>
<li> <a href="#">Menu3</a></li>
</ul>
<script>
$('#menu li').click(function () {
var f = this;
$('#menu li').each(function () { this.className = this == f ? 'actived' : 'noactive' });
});
</script>
</body>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
<style>
.actived {
background: red;
}
.noactive {
background:;
}
</style>
<ul id="menu">
<li> <a href="#">Menu1</a></li>
<li> <a href="#">Menu2</a></li>
<li> <a href="#">Menu3</a></li>
</ul>
<script>
$('#menu li').click(function () {
var f = this;
$('#menu li').each(function () { this.className = this == f ? 'actived' : 'noactive' });
});
</script>
</body>
</html>
在上面基础上进行更改的内容
$('#menu li a').each(function(){
if(!String(window.location).indexOf($($(this))[0].href))//如果地址栏目包含有当栏目下 的内容那么执行下一句操作
$(this).parent().addClass('active').siblings().removeClass('active');
});