如何在 javascript 中通过点从 DIV 容器中获取元素

How to get element from a DIV container by points in javascript?

本文关键字:DIV 元素 获取 javascript      更新时间:2023-09-26

我在".container"DIV元素中创建了一个5个DIV数字,如波纹管;

<div class="container">
   <div class="elem1">No 1</div>
   <div class="elem2">No 2</div>
   <div class="elem3">No 3</div>
   <div class="elem4">No 4</div>
   <div class="elem5">No 5</div>
</div>

TouchStartTouchMoveTouchEnd 事件已分配给 .container 元素。

.elem1容器的触摸启动时,触摸启动事件处理程序在event.target中接收"elem1"。

在".elem4"中容器的触摸端,触摸端事件处理程序在event.target中接收"elem1",但我在 elem4 中释放触摸。这就是问题所在。我需要在这里获得 elem4

如何在触摸端事件处理程序上获取确切的元素?通过使用接触点对此有任何解决方案/建议吗?

您是否正在使用 jQuery 来侦听触摸事件?我会做类似的事情:JSFiddle。本质上,我正在侦听触摸类本身上的触摸事件,然后从 ID 中提取特定数据。你可以用任何东西代替 ID,无论是数据属性还是 innerHTML。事件冒泡可能会变得毛茸茸的,这个解决方案过去对我有用。

附言您知道您现在可以在谷歌浏览器中模拟触摸事件吗?查看此页面!

以下方式使用 event.pageXevent.pageY document.elementFromPoint

$('.container').bind('touchend', function(ev){
    ev.preventDefault();
    ev.stopPropagation();
    var el = document.elementFromPoint(ev.pageX, ev.pageY);
});

我在这里举了一个例子:

http://jsfiddle.net/MPn3L/

(请注意,我模拟了mouseup事件,但它与触摸设备上的touchend相同)

这是我能想到的最好的解决方案。