html - 切换事件链接的 css 类

Question

我在页面上有 5 个链接，当我点击每个链接时它会改变颜色，但是一旦 ma=ove 我的光标并放在页面的其他区域，事件链接上的焦点就会消失。所以我无法显示当前的链接状态。请告诉我如何修复

Answer 1

HTML

<tr>
 <td>
  <a href="#" class="linkbold">Basic2</a>
 </td>
</tr>
<tr>
 <td>
  <a href="#" class="linkbold">Basic3</a>
 </td>
</tr>
<tr>
 <td>
  <a href="#" class="linkbold">Basic4</a>
 </td>
</tr>

CSS

.linkbold{ color:#0066FF; font-family:Tahoma; font-size:11px; text-decoration:none; font-weight:bold !important; }
.active { color: red; } // define any color for active class

// you can use css shorthand for font property
.linkbold { font: bold 11px Tahoma, sans-serif; color:#0066FF; }

如果您想了解更多css shorthand

Jquery

$('a.linkbold').on('click', function(){
    $('a.linkbold').removeClass('active'); // remove any active class
    $(this).addClass('active'); // and then add active class for clicked element.
});​

Working example here