9

我要解决的问题是“这个位置是什么？”

获取 DIV 的 x/y 位置（偏移量）相当简单，但反过来呢？如何在给定 x/y 位置的情况下获取 DIV（或任何元素）的 id？

4

9 回答 9

4

不幸的是，触发制造/模拟的鼠标事件将不起作用，因为当您调度它时，您必须提供一个目标元素。由于该元素是您要弄清楚的元素，因此您所能做的就是将其分发到身体上，就好像它已经冒泡了一样。

您真的只能自己做，即手动遍历您感兴趣的元素，并将它们的位置/大小/zIndex 与您的 x/y 点进行比较，看看它们是否重叠。除了在 IE 和最近的 FF3 中，您可以在其中使用

var el = document.elementFromPoint(x, y);

看

http://developer.mozilla.org/En/DOM:document.elementFromPoint

http://msdn.microsoft.com/en-us/library/ms536417(VS.85).aspx

于 2008-09-10T16:35:15.187 回答
3 
function getDivByXY(x,y) {
   var alldivs = document.getElementsByTagName('div');

   for(var d = 0; d < alldivs.length; d++) {
      if((alldivs[d].offsetLeft == x) && (alldivs[d].offsetTop == y)) {
         return alldivs[d];
      }
   }

   return false;
}
于 2008-09-08T15:23:45.233 回答
2

如果您只有 X 和 Y 位置（并且您无法像您提到的那样跟踪鼠标移动），那么您将不得不遍历 DOM，循环遍历每个 DIV。对于每个 DIV，您需要将其 X 和 Y 坐标与您拥有的坐标进行比较。这是一项昂贵的操作，但这是唯一的方法。我建议你最好重新考虑你的问题，而不是想出一个解决方案。

于 2008-09-08T02:40:19.797 回答
2

使用 JQuery 选择器过滤所有 DIV 的列表以找到与您的职位标准匹配的 DIV？

于 2008-09-08T01:57:51.350 回答
2

创建鼠标事件侦听器，然后在该位置触发鼠标事件。这应该为您提供该位置的整个元素堆栈。

或者，查看 Firebug 的来源。

于 2008-09-08T02:05:57.460 回答
1

我认为约翰所说的是您可以使用 document.createEvent() 在您想要的位置模拟鼠标移动。如果您捕获该事件，通过向主体添加事件侦听器，您可以查看 event.target 并查看该位置的元素。我不确定IE在多大程度上支持这种方法，也许其他人知道？

http://developer.mozilla.org/en/DOM/document.createEvent

更新： 这是一个模拟事件的 jquery 插件：

http://jquery-ui.googlecode.com/svn/trunk/tests/simulate/jquery.simulate.js

于 2008-09-08T10:20:00.627 回答
1

一种选择是构建一组“div-dimension”对象。（不要与 div 本身混淆......当您从对象中读取尺寸时，IE7 性能令人沮丧。）

这些对象包括一个指向 div 的指针、它们的尺寸（四个点……比如顶部、左侧、底部和右侧），可能还有一个脏位。（只有在尺寸发生变化时才真正需要脏位。

然后，您可以遍历数组并检查尺寸。它需要 O(n) 在每次鼠标移动时执行此操作。使用二分搜索风格的方法，您可能会做得更好……也许。

如果您使用二分搜索风格的方法，一种方法是存储 4 个数组。每个维度都有一个点，然后对所有四个进行二分查找。O(4logn) = O(logn)。

我并不是说我推荐其中任何一个，但它们可能会起作用。

于 2008-09-08T02:28:41.447 回答
0

您可能会发现在加载页面时遍历 DOM 树一次，获取所有元素的位置和大小，并将它们存储在数组/哈希/等中会更有效。如果你设计好数据结构，你应该能够在以后需要时相当快地找到给定坐标处的元素。

考虑您需要多久检测一次元素，并将其与页面上元素更改的频率进行比较。您将需要重新计算所有元素位置的次数（昂贵的计算）与实际使用计算信息的次数（我希望相对便宜）。

于 2008-09-08T03:16:49.210 回答
0

这可能有点过于占用处理器资源，但会遍历页面上的整个 div 元素列表，找到它们的位置和大小，然后测试它们是否在鼠标下。我不认为我想对浏览器这样做。

于 2008-09-08T02:08:44.100 回答