如何使选定的链接处于活动状态答案

【问题标题】：How to make a selected link active如何使选定的链接处于活动状态
【发布时间】：2017-02-24 19:24:16
【问题描述】：

我可以显示选定的链接，但是当我单击页面中的某个位置时，突出显示消失了。我也在努力让悬停等边缘突出显示。

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

#sidebarContent a :ACTIVE, #sidebarContent a:FOCUS{
        background-color: Green;
        padding: 5px 10px; 
        /* margin-left:auto;
        margin-right:auto; */
        text-decoration: none;
        width: 120px;           
    }

【问题讨论】：

你必须在你的链接上附加一个类； :focus 和 :active 仅在您与该元素交互时才会持续存在（例如 :hover）。
我看到这是用 jQuery 标记的，我建议你检查一下：stackoverflow.com/questions/7738219/…。当谈到边缘部分的亮点时，我认为我们可能需要一些详细说明
完美。谢谢各位！
@Anant，对不起，我没注意到。
@Anant 我看不到你的答案了。你知道为什么吗？

标签： javascript jquery html angular-ui-bootstrap

【解决方案1】：

如果您使用 Angular 应用程序（您添加了此标签） - 您可以使用 active 类来标记您当前的路线，而不是使用 ::focus 伪类。

  <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;
}

请检查这个小提琴https://jsfiddle.net/vadimb/2waujx3m/

【讨论】：

如果他真的在使用angular-ui-bootstrap，那么这是更好的例子。 BTW +1 用于 jsfiddle 链接