0

这是一个很大的布局，所以我将只发布链接到 jQuery 和 HTML 的部分（完整站点位于http://www.gronge.com/index3.php）。一切正常，除了 About 链接在 Firebug 检查中变回 .navBarActive 但视觉上没有变化。我是网页设计的新手，这是迄今为止我遇到的第一个大问题。

jQuery

$(document).ready(function() {
    $("li.navBarNormal").click(function () {
        $("li.navBarActive").removeClass("navBarActive").addClass("navBarNormal");
        $(this).removeClass("navBarNormal").addClass("navBarActive");
    })
});

HTML

<ol id="navLinks"> 
    <li id="navLinkAbout" class="liNav fontWhite navBarActive">About</li>
    <li id="navLinkSubscribe" class="liNav fontWhite navBarNormal">Subscribe</li>
    <li id="navLinkNews" class="liNav fontWhite navBarNormal">News</li>
    <li id="navLinkUpdates" class="liNav fontWhite navBarNormal">Updates</li>
    <li id="navLinkContact" class="liNav fontWhite navBarNormal">Contact</li>
</ol>
4

2 回答 2

2

这是因为您没有在节点上设置事件侦听#navLinkAbout器，因为该节点没有navBarNormal开始的类。

我的建议是使用更好的选择器来设置监听器，例如#navLinks li.

$(document).ready(function() {
    $("#navLinks li").click(function () {
        $("li.navBarActive").removeClass("navBarActive").addClass("navBarNormal");
        $(this).removeClass("navBarNormal").addClass("navBarActive");
    })
});
于 2012-08-20T04:11:39.423 回答
1

试试这个：http: //jsfiddle.net/treyeckels/DgQfw/

将事件触发器更改为“li.liNav”。这会将事件处理程序应用于所有链接。然后对此（单击的）执行添加/删除操作，遍历并找到兄弟姐妹并执行其添加/删除操作。

$(document).ready(function() {
$("li.liNav").click(function() {
    $(this).removeClass("navBarNormal").addClass("navBarActive").siblings().removeClass("navBarActive").addClass("navBarNormal");
}) });​
于 2012-08-20T04:20:13.743 回答