javascript - 单页网站链接颜色切换 Javascript

Question

我正在构建一个单页微型网站，所有内容都在一个页面上。我正在使用锚标签跳转到网站的特定部分。我想要实现的是一个跨浏览器解决方案，它将使我的链接颜色与 :hover 相同并一直停留到另一个链接被点击，然后作为回报，之前点击的链接会恢复到正常状态。

请帮忙！谢谢

Answer 1

这是关于JSFiddle的解决方案

HTML

<a href="#" class="selected">Test 1<a>
<a href="#" class="">Test 2<a>​

CSS

a.selected {
    color: pink;
}​

JavaScript（使用 jQuery）

$("a").on("click", function () {
    if ($(this).hasClass("selected")) { return; }

    $("a").removeClass("selected");        
    $(this).addClass("selected");
});​

在此示例中，我使用页面上的所有锚标记。使用类更具体地选择它们可能会更好。

在运行上面的代码之前添加下面的 html 行，但是 put 在你的页面中尽可能低。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>