提问人：Dexter 提问时间：11/3/2023 更新时间：11/11/2023 访问量：25
当用户的意图是单击时，如何避免鼠标悬停事件
How to avoid mouseover event when the user's intent is to click
问：
我有一个可以悬停和点击的元素。在将鼠标悬停在元素上时，我显示了某些内容的预览，但在单击时，我需要根据与单击事件相关的逻辑完全更改页面的内容。现在的问题是，当用户的意图是点击时，即使我的代码最终也会触发悬停流，因为首先触发鼠标悬停事件，然后是点击事件。从CX的角度来看，它没有造成任何问题，但它实际上正在减少网页的延迟，因为在鼠标悬停流上做了繁重的工作，这实际上是无用的，因为用户的意图是点击。我能想到的一种解决方案是在鼠标悬停事件后等待一段时间，这样如果同时触发了单击事件，我可以删除悬停事件。但这种解决方案并不好，因为当用户的意图是实际悬停时，它会影响他们的体验。有没有更好的方法可以通过JS / jQuery避免这种情况。我不能使用任何外部库。 谢谢
答：
0赞
flyingfox
11/4/2023
#1
没有办法读懂用户的想法。因此，只需让用户选择他们想要的内容即可。例如，您可以添加一个复选框来打开/关闭悬停事件，并根据常见性能给出默认值
-1赞
Oriole
11/11/2023
#2
在你的元素上，试试这个css内容：
element{
cursor: not-allowed;
pointer-events: none;
}
评论
0赞
Quentin
11/11/2023
这将阻止 OP 想要检测的点击事件。
评论
setTimeout()clearTimeout()