1

我有 3 个 div 像俄罗斯套娃一样相互包含。

对于所有 div，我有一个绑定 mouseenter 事件的函数。现在从底部慢慢移动鼠标，进入第三层将导致以下事件：

  1. 鼠标进入第一层
  2. 鼠标进入第二层
  3. Mouseenter 第三层

这是完美的，也是预期的结果，因为您需要先进入第一层，然后才能进入第二层，等等。

但是，如果我通过快速移动鼠标执行相同操作，则顺序将是未指定的，例如：

  1. 鼠标进入第二层
  2. 鼠标进入第一层
  3. Mouseenter 第三层

这对我来说没有太大意义 - 你的鼠标如何在进入第一层之前进入第二层？

无论如何，问题是：有什么方法可以强制 jQuery 或 javascript 以它们的自然顺序触发这些事件？如果不是，您能否建议我一种解决方法，例如以某种方式从我的事件处理程序函数中对事件进行排序，并推迟那些过早调用的事件？

测试代码发布在http://jsbin.com/ibepu6/4/

4

3 回答 3

2

通常 mouseenter 和 mouseleave 事件是基于 microsoft 的事件，jquery 使它们可以在所有浏览器中使用，使用其他功能来创建这种效果......首先看看并测试jquery 事件页面中的演示。我不检查jquery源，但据我所知，javascript中有两种不同的事件排序机制......事件捕获和事件冒泡......

本文档并不新鲜，但它描述了您需要的基础知识。 这是关于鼠标事件以及它们如何执行的旧文档...

所以检查 jquery 源代码，看看 mouseenter 和 mouseleave 是如何工作的。正如我之前所说，它不是仅在 IE 上运行的基本功能，而是通过使用其他 javascript 函数就像 mouseenter 和 mouseleave 事件一样的模拟......这就是 jquery 如何使这两个 Microsoft 事件可用于所有浏览器...... .

于 2011-04-20T07:44:33.317 回答
0

我在 Jsbin 中编辑了您的代码，以便对触发的事件进行排序。我不确定它是否对您的情况有用，但这里是代码Edited Jsbin

于 2011-04-20T07:30:48.683 回答
-1

问题是：

在任何情况下，您都不能将鼠标直接带到第三层，因为它在第二层内，即在第一层内。第二层和第一层有可见部分。

无论您移动鼠标的速度有多快，它仍然会在第三个之前触发第一个或第二个。对此没有明显的解决方案，可见的第二层和第一层部分鼠标悬停总是会在第三层之前触发第二层和第一层鼠标悬停。如果您移动得非常快，则此顺序可以更改，但不能保持一致。

于 2011-04-16T10:00:14.767 回答