可能重复: 如何获取位于点击点的所有元素的列表?
我知道我可以通过使用 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; iPossible 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)。转发接触?
发布评论