$("#menu li").click(function () {
$("#menu .active").removeAttr("class");
$(this).attr("class","active");
});
<div id="menu">
<ul>
<li id="m1" class="active"><a>link 1</a></li>
<li id="m2"><a>link 1</a></li>
<li id="m3"><a>link 2</a></li>
<li id="m4"><a>link 3</a></li>
<li id="m5"><a>link 4</a></li>
<li id="m6"><a>link 5</a></li>
<li id="m6"><a href="">link 6</a></li>
<li id="m7"><a href="">link 7</a></li>
<li id="m8"><a>link 8</a></li>
</ul>
</div>
的CSS:
#menu .active{
background:white;
}
#menu .active a{
opacity:0.5;
}
#menu a{
color:#08042b;
text-decoration:none;
font-size:14px;
text-shadow: 1px 0px 1px #6055c8;
position:relative;
}
当我第一次点击链接时,一切似乎都没问题。 当我第二次点击这个李的背景颜色改变了li字体采用不透明度0.5, 之前的li没有活动的className,但之前的li文本没有进入不透明度:1 有什么帮助吗?
答案 0 :(得分:2)
正如所说的那样,使用$("#menu .active").removeClass("active");
比删除整个类属性更正确,因为你可能会失去你可能拥有的其他类,从而导致意外行为。