css - 按住鼠标左键时，Chrome 不会应用 css 悬停样式

Question

在 Google Chrome 中，按住鼠标左键时不会触发 CSS 悬停状态，如下所示:

a:hover {
  color: red;   
}

<a href="http://www.jsfiddle.net">words</a>

http://jsfiddle.net/RHGG6/1/

FF8 和 IE9 都不会出现这个问题。这是有问题的，因为我正在实现拖放操作并使用 CSS 突出显示放置目标。我可以在 JavaScript 中非常简单地完成这项工作，但对于本质上是 CSS 的问题来说，这似乎有些笨拙。对此有任何解决方法吗？

Answer 1

从一些尝试来看，如果在元素上移动时按住左键，Windows7 上的 Chrome 30.0.1599.69 m 似乎不会生成 mouseenter 事件。因此，依赖 onmouseenter 事件会产生与使用 css 相同的结果 - 也许这个(非触发的)事件用于向 css 引擎发出信号，表明某些内容需要更改。

无论如何，您只需添加代码来处理 mousemove 和 mouseout 事件即可。我只是用 js 设置文本颜色，尽管切换类的东西可能是更好的选择。至少 js 将使用 css 应该使用的时间，所以它不会全部开销，尽管它确实在鼠标移动时重做它。

或许您可以在您尝试删除的处理程序中使用 removeEventListener。如果是这样，您可以附加 js 以使用 addEventListener 处理事件，在页面加载时附加到两个事件。当触发 onmousemove 事件时，您可以更改样式，然后删除处理程序。然后，当触发 mouseout 事件时，您可以恢复样式并重新附加 onmove 处理程序。如果尝试从事件中删除处理程序，从处理程序本身内部会失败，我不会感到惊讶，但只能尝试。它只会向 js 添加几个字节，但会极大地提高效率(就链接而言，而不是整个页面)-如果鼠标在链接上移动很多到 100%，则可能非常差 - 即样式每个进入/离开周期被设置一次并被清除一次。

<a href="http://www.jsfiddle.net" onmousemove = "this.style.color='red'" onmouseout = "this.style.color=''">words</a>

适用于我 - 注意:仅在 win7 中使用 chrome 进行了测试。