Javascript / jquery，获取所有divs位置在（x，y）。转发接触？ [英] Javascript/jquery, get all divs location at (x,y). Forwarding touches?

问题描述

可能重复：

如何获取位于点击点的所有元素的列表？

我知道我可以通过使用 document.elementFromPoint（x， y）。

问题是我需要获取包含触摸事件位置的每个div。

我如何将触摸传播到下面的元素？ hacky解决方案，显示/隐藏元素，而重新生成事件，或指针事件样式与css，但我不能使用这些，他们可能会导致闪烁...

下图说明了我需要做什么：

如果紫色，绿色和蓝色框代表div元素，红点是触摸位置，我需要一个函数，返回div3，div2 ，div1。

解决方案

此代码不会闪烁：

  $（body）click（function（e）{
 var x = e.pageX，y = e.pageY; 
 var res = [] 
 
 var ele = document.elementFromPoint（x，y）; 
 while（ele& ele.tagName！=BODY& ele.tagName！=HTML ）{
 res.push（ele）; 
 ele.style.display =none; 
 ele = document.elementFromPoint（x，y）; 
} 
 
 for（var i = 0; i  res [i] .style.display =; 
} 
 console.log（res）; 
}）; 
  

Possible Duplicate:
How to get a list of all elements that resides at the clicked point?

I know I can get the element with the highest z-index by using document.elementFromPoint(x,y).

The problem is I need to get every div that contains the touch event's location.

How can I propagate touches to elements underneath?

I have seen some hacky solutions that show/hide elements while re-generating the event, or pointer-events style with css, however I cannot use these and they may cause flickering...

The following diagram illustrates what I need to do:

If the purple, green, and blue boxes represent the div elements, and the red dot is the touch location, I need a function that would return "div3, div2, div1".

解决方案

No flickering with this code:

$("body").click(function(e){
    var x = e.pageX, y = e.pageY;
    var res = [];

    var ele = document.elementFromPoint(x,y);
    while(ele && ele.tagName != "BODY" && ele.tagName != "HTML"){
        res.push(ele);
        ele.style.display = "none";
        ele = document.elementFromPoint(x,y);
    }

    for(var i = 0; i < res.length; i++){
        res[i].style.display = "";
    }
    console.log(res);
});​

这篇关于Javascript / jquery，获取所有divs位置在（x，y）。转发接触？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！