这应该很简单,但我无法让它工作
我的 list
<div id="ctMenu">
<ul>
<li><a href="#">WELCOME</a></li>
<li><a href="#">ABOUT US</a></li>
<li><a href="#">CONTACT</a></li>
</ul></div>
我的 CSS
#ctMenu { width:1010px; margin: 20px 0 0 0; padding:20px 0 20px 0}
#ctMenu ul { margin:0; padding:0;}
#ctMenu ul li { margin-left: 0; margin-bottom:0; display:inline;}
#ctMenu ul li a { padding: 10px 25px 9px 25px; background-color:green; text-decoration: none; color:Black; font-weight:bold; }
#ctMenu ul li a:hover {background-color:Gray; }
.selected { background-color: yellow; }
我的 jQuery
$(document).ready(function () {
$('#ctMenu ul li a').click(function () {
$('#ctMenu ul li a').removeClass('selected');
$(this).addClass('selected');
});
});
我只是想在有人单击链接时将 css 设置为类“.selected”。有什么建议吗?
编辑:这是一个JSFiddle
最佳答案
问题是您声明了一个更强大的 CSS 规则 #ctMenu ul li a
覆盖了 .selected
。试试这个 CSS 规则:
#ctMenu ul li a.selected { background-color: yellow; }
关于jquery - 在选定的链接上添加类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7679466/