我有一个容器，其中的li元素嵌套在ul元素中。我正在尝试使用Javascript删除并添加一个在容器中选择li元素时称为active的类。但是，当我单击类时，不会添加或删除li元素类。当我在浏览器中检查Web开发人员时，收到消息“未定义不是函数”
HTML：
<div class="about_nav">
<ul>
<li class="active"><a href="#story">Our Story</a></li>
<li><a href="#blocks">International Blocks</a></li>
<li><a href="#works">How it works</a></li>
<li><a href="#gift">The Perfect Gift</a></li>
</ul>
</div>
CSS：
.about_nav {
background: no-repeat #FFF 12px 3px;
box-shadow:0 0 10px rgba(0, 0, 0, 0.41);
width:25%;
margin:35px 20px 20px 70px;
float:left;
position:fixed;
}
.about_nav ul {
margin-top:0;
margin-bottom:0;
padding-left:0;
list-style:none;
background-color:#FFF;
}
.about_nav li {
margin-top:2px;
margin-left:0px;
position:relative;
display:block;
}
.about_nav li:hover {
background:#eee;
border-radius:4px;
}
.about_nav li>a {
color:#428bca;
text-decoration:none;
padding:10px 15px;
position:relative;
display:block;
}
.about_nav li>a:hover {
color:#2a6496;
text-decoration:none;
border-radius:4px;
}
.about_nav li.active>a,
.about_nav li.active>a:hover,
.about_nav li.active>a:focus {
color:#FFF;
background-color:#428bca;
}
Javascript：
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
$( document ).ready(function() {
$('.about_nav li').on('click', function(e) {
$('.about_nav li').removeClass('active');
$(this).addClass('active');
});
});
</script>
任何帮助是极大的赞赏！
您正在使用严重过时的jQuery版本。问题是.on()直到1.7版才添加。您正在使用1.4。升级您的jQuery版本，它应该可以正常工作。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句