jquery - 单击jquery更改文本颜色

标签 jquery html css

我有以下 css 和 jquery 代码来尝试在单击 ul 中的文本时更改文本颜色。如果当前文本颜色是#d49a9a,我想将其改回#c2c0c0,反之亦然。

.navContainer ul{
    left: 10px;
    top:  20px;
    position: absolute;
    color: #c2c0c0;
    font-family: 'Terminal Dosis';
    font-weight: 200;
    font-size: 20pt;
    list-style-type: none;
    line-height: 50px;
}
.navContainer a {
    text-decoration: none;
    color: #c2c0c0;
}
.navContainer {
    left: 150px;
    top: 150px;
    position: absolute;
} 

编辑 --- 这是我的 html

<head>
...some code
<script type="text/javascript">
            $("#navContainer li").click( function() { 
              $("#navContainer li").css("color", "#d49a9a");
              $(this).css("color", "#c2c0c0");
            });
            </script>
</head>
<div class="navContainer">
            <ul>
                <li class="navText">Work</li>
                <li class="navText"><a href="#">Blog</a></li>
                <li class="navText">About</li>
                <li class="navText">Contact</li>
            </ul>
        </div>

请你告诉我我做错了什么。

最佳答案

好的,我知道发生了什么。最初你有错误的标签,但目前你需要使用 $(".navContainer li") 而不是 $("#navContainer li") 因为 navContainer 是一个类而不是身份证。我一起制作了一个演示,应该可以让您开始。

http://jsfiddle.net/nHJvz/1/

关于jquery - 单击jquery更改文本颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7327459/

相关文章:

javascript - 本地开发环境上的 jQuery AJAX 请求失败

jquery - 如何检查父元素是否隐藏子元素?

html - 溢出 :hidden and overflow-y: scroll on ul not working;

html - SVG图像作为背景图像时如何修改填充颜色?

javascript - li 的自动宽度适合文本?

css - 使用 CSS 和 SVG 的菱形菜单项

javascript - 连续多次运行 jQuery 函数(对于 Bookmarklet)

javascript - 是否有悬停或 mouseenter/mouseleave 的切换?

html - 将垂直范围 slider 与其末端的按钮对齐

javascript - Cookie 未使用 jquery 正确删除