在 touchend 事件期间查找元素手指处于打开状态

Question

当调用 touchend 事件时，我需要发现手指下的 html 元素。我正在使用的代码；

$('.wsSquare').on("mouseup touchend",function(event){
    event.preventDefault();
    event.stopPropagation();
    console.log($(event.target).data());    
});

在（非触摸）设备上使用鼠标，此代码正确记录了在 mouseup 事件发生时与鼠标下的元素相关联的数据。

但是在触摸设备（ipad safari）上，event.target 是在 touchstart 事件期间位于手指下的元素，并记录 touchstart 事件下元素的数据

我还检查了 touchmove 事件的行为，这也具有相同的行为（event.target 是 touchstart 元素）。似乎所有触摸事件的目标都是在手势开始时触摸的元素。

当调用 touchend 事件时，我需要访问手指下的元素。我的手势可能会遍历许多元素。

编辑

进一步的研究从the specification 挖掘了这个。

5.5 touchend 事件

用户代理必须调度此事件类型以指示用户何时从触摸表面移除触摸点，还包括触摸点物理离开触摸表面的情况，例如被拖离屏幕。

此事件的目标必须与触摸点第一次放置在表面时所开始的元素相同，即使触摸点已经移出目标元素的交互区域.

被移除的一个或多个触摸点必须包含在 TouchEvent 的 changedTouches 属性中，并且不得包含在 touches 和 targetTouches 属性中。

所以观察到的行为是正确的，我该如何改变这种行为？

Answer 1

使用document.elementFromPoint 并将事件的坐标提供给它，例如，像这样：

$('.wsSquare').on("mouseup touchend",function(event){
    event.preventDefault();
    event.stopPropagation();
    var changedTouch = event.changedTouches[0];
    var elem = document.elementFromPoint(changedTouch.clientX, changedTouch.clientY);
    // Do something with elem
});