Javascript 如何使选定链接处于活动状态

我可以显示选定的链接，但当我单击页面中的某个位置时，突出显示消失。我也在努力让高光像悬停一样到达边缘

我附上了一段代码和一张图片供参考

---

如果您使用角度应用程序（您添加了此标记）-您可以使用

active

class来标记当前路线，而不是使用

：：focus

pseudo class

  <a href="#/home" ng-class="{active: isActive('home')}">Home</a>
  <a href="#/about" ng-class="{active: isActive('about')}">About</a>

---

请检查此提琴

您必须在链接上附加一个类

：focus

和

：active

仅在您与该元素交互（如

：hover

）时保持不变。我看到这是用jQuery标记的，建议您勾选以下内容：。当谈到突出显示到边缘部分时，我认为我们可能需要一些精雕细琢。谢谢各位@阿南特，对不起，我没注意到我的人。@阿南特，我再也看不到你的答案了。你知道为什么吗？如果他真的在使用

angular ui bootstrap

，那么这就是一个更好的例子。顺便说一句，JSFIDLE链路为+1

  <a href="#/home" ng-class="{active: isActive('home')}">Home</a>
  <a href="#/about" ng-class="{active: isActive('about')}">About</a>

$scope.isActive = function(path) {
    return $location.path() == '/' + path;
}