如何在按下鼠标时在 Chrome 中保持悬停状态

Question

当我的用户按下自定义下拉列表时，我正在停止mousedown事件。这是为了避免在用户有效拖动鼠标时浏览器的默认文本突出显示行为。

我正在使用处理程序函数中的 jQuery event.preventDefault() 调用并返回 false。

这具有所需的效果，除了在Chrome中，它还会阻止CSS :hover状态在仍然按下鼠标时工作。

Firefox没有遇到同样的问题。文本突出显示被取消，当用户在仍然按下鼠标的情况下滚动项目时，：悬停状态将继续工作。

有没有一种方法也可以在 Chrome 中使用？

我可以添加更多mouseover处理程序来添加自定义类，但我更喜欢更优雅的解决方案，这样我就可以在我的 CSS 中使用 ：hover 伪类。

Answer 1

为了防止突出显示文本，有一个 CSS3 属性。我在一个SO问题中找到了这个信息。防止文本表突出显示"

编辑：我认为这个"如何使用CSS禁用文本选择突出显示？"更好，因为涵盖了更多的浏览器，从而使它更加跨浏览器。

Answer 2

您可以将 CSS 定义为 ：hover， .hover { ... }然后只需在鼠标悬停时切换类

Answer 3

在文档鼠标向下时，只需将此类添加到正文中：

.stopSelect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

这将阻止文本选择。鼠标向上删除类。