javascript - CSS:悬停和 Activity 限制-特定情况

我有以下规则：

.foo { /* default foo style */ }
.foo:hover { /* hover style */ }
.fooactive { /* extra styles when active */ }

在我的主播上，我这样呼叫：

onclick="showDetails(123,this)"

最后，在js函数上，我拥有：

function showDetails(eid, element){
  $('.foo').removeClass('fooactive');
  $(element).addClass('fooactive');
}

当我单击时，我应该有效果，但是我没有立即看到效果，因为我也有CSS：hover规则，并且只有在展开该元素区域时，我才最终看到该效果。

单击后如何禁用悬停效果，以免发生这种奇怪的效果？还有其他方法吗？

最佳答案

更新.fooactive的CSS规则，如下所示：

.fooactive, .fooactive:hover { /* extra styles when active */ }

这将覆盖您在基本foo类中看到的悬停效果。