html - anchor 标签不起作用并保持选中状态，直到我再次单击

Question

我正在创建某种仪表板，它提供不同的数据状态。如果单击状态，则应仅显示具有该状态的对象。现在我还有

<a href="#">*TEXT*</a>

对于所有 anchor 。但是当我点击它们时，我的 URL 没有改变，当我将光标移动到不同的位置时，文本仍然带有下划线。

图像中第一个带下划线的规则是悬停，最后一个是我之前点击的那个。现在只有在我点击其他地方后，即使是网站上的空白部分，下划线也会消失。

有谁知道为什么会发生这种情况以及我该如何解决？

提前致谢。

JSFIDDLE:http://jsfiddle.net/xcjufs6e/

Answer 1

我能够通过在 CSS 中添加这些行来解决它

.conexio-info-message a:focus {
    text-decoration: none;
}

.conexio-info-message a:focus:hover {
    text-decoration: underline;
}