鼠标悬停在布局更改时无意中触发图像

mouseover fires inadvertently for image on layout change

我的 HTML 文档中有很多图像。

用户在点击图片或按键时触发一些变化(AJAX 调用)。

为了跟踪最新的图像(客户端),我使用 javascript 和 onmouseover,将图像 ID 分配给 javascript 变量,该变量又用于填充 AJAX 来电。

一切正常(即使可能有更好的方法),但有时刷新图像需要一些时间。一瞬间,它不复存在,导致旁边的图像向左跳。

当然,这会将图像移动到指针下方,触发 mouseover 事件。

如何(?)区分鼠标移动引起的 mouseover 事件和布局更改引发的事件?

简短的回答是,除了光标移到新的 DOM 元素(或其他一些东西,例如点击触摸设备)。布局更改只是独立于此事件发生的事情。

您的实际问题的一种可能解决方案是通过防止布局跳转来完全避免该问题。例如,您可以在加载下一张图片时使用占位符元素填充 space。

或者,您的逻辑几乎肯定可以变得更加稳健,以免依赖于像这样脆弱的东西。