Question

我有很多链接，我需要在用户点击后将文本颜色更改为红色

我有类似的东西：

<li class="test" ng-repeat="item in items">
  <a href="" ng-click="clickMe()" class="test-li">
    {{item.name}}
  </a>
</li>

目前风格就像

.test-li {
  color: black;
}

我希望我的文字在用户点击后变为红色。

所以我这样做：

.test-li:visited {
    color:red;
}

单击该项目时有效，但单击其他项目后颜色会变回黑色。我觉得这可以简单地在CSS中存档而无需设置ng-class。任何人都可以帮我吗？非常感谢！

Answer 1

您的链接中没有任何目标网址，因此浏览器确实无法知道哪些链接已被访问过。我想如果您要在链接中的href属性中添加一个简单的＃test，＃test1，＃test2等，您会发现您的CSS确实可以正常工作。

Answer 2

由于您的链接实际上并不存在，因此您最好在点击时通过JS为您的<a>元素添加“已访问”类。

jQuery exmample：

$('li a').click(function(){
  $(this).addClass('visited');
  // or you could use $(this).toggleClass('visited'); depending on what you want to achieve.
});

如何在我的情况下更改文本颜色

2 个答案: