这当然不是事件目标应该如何工作。另一个 DOM 不一致性，我们现在可能都被永远困住了，因为供应商在没有任何审查的情况下提出了闭门造车的扩展。

使用document.elementFromPoint解决它。

document.elementFromPoint(event.clientX, event.clientY);

2010 年接受的答案不再有效：touchmove没有clientXorclientY属性。（我猜它曾经有过，因为答案有很多赞成票，但目前没有。）

目前的解决方案是：

var myLocation = event.originalEvent.changedTouches[0];
var realTarget = document.elementFromPoint(myLocation.clientX, myLocation.clientY);

经过测试并适用于：

• iOS 上的 Safari
• iOS 上的 Chrome
• 安卓上的 Chrome
• 支持触控的 Windows 桌面上的 Chrome
• 支持触控的 Windows 桌面上的 FF

不适用于：

• 支持触控的 Windows 桌面上的 IE

未测试：

• 视窗电话

我在 Android (WebView + Phonegap) 上遇到了同样的问题。我希望能够拖动元素并检测它们何时被拖动到某个其他元素上。出于某种原因，触摸事件似乎忽略了pointer-events属性值。

老鼠：

• 如果pointer-events="visiblePainted"设置，event.target则将指向拖动的元素。
• 如果pointer-events="none"设置然后event.target将指向拖动元素下的元素（我的拖动区域）

这就是事情应该如何运作以及我们首先拥有该pointer-events属性的原因。

触碰：

• event.target始终指向拖动的元素，无论pointer-events值哪个恕我直言是错误的。

我的解决方法是创建我自己的拖动事件对象（鼠标和触摸事件的通用界面）来保存事件坐标和目标：

• 对于鼠标事件，我只是按原样重用鼠标事件

• 对于触摸事件，我使用：

  DragAndDrop.prototype.getDragEventFromTouch = function (event) {
      var touch = event.touches.item(0);
      return {
          screenX: touch.screenX,
          screenY: touch.screenY,
          clientX: touch.clientX,
          clientY: touch.clientY,
          pageX: touch.pageX,
          pageY: touch.pageY,
          target: document.elementFromPoint(touch.screenX, touch.screenY)
      };
  };
  

然后使用它进行处理（检查拖动的对象是否在我的拖动区域中）。出于某种原因document.elementFromPoint()，pointer-events即使在 Android 上似乎也尊重value。

因此，当涉及到如何交互时，触摸事件具有不同的“哲学”：

• 鼠标移动 = “悬停”之类的行为
• 触摸移动 = “拖动”之类的行为

这种差异来自这样一个事实，即不能在没有 touchstart 事件的情况下进行 touchmove，因为用户必须触摸屏幕才能开始此交互。使用鼠标，用户当然可以在整个屏幕上移动鼠标而无需按下按钮（mousedown 事件）

这就是为什么基本上我们不能希望使用触摸悬停效果之类的东西：

element:hover { 
    background-color: yellow;
}

这就是为什么当用户用一根手指触摸屏幕时，第一个事件 (touchstart) 获取目标元素，随后的事件 (touchmove) 将保留对触摸开始的原始元素的引用。感觉不对，但有这种逻辑，您可能还需要原始目标信息。所以理想情况下，将来应该有（源目标和当前目标）可用。

因此，今天（2018 年）屏幕可以同时是鼠标和触摸的常见做法仍然是附加两个侦听器（鼠标和触摸），然后“标准化”事件坐标并使用上述浏览器 api 在这些坐标中查找元素：

  // get coordinates depending on pointer type:
  var xcoord = event.touches? event.touches[0].pageX : event.pageX;
  var ycoord = event.touches? event.touches[0].pageY : event.pageY;
  // get element in coordinates:
  var targetElement = document.elementFromPoint(xcoord, ycoord);
  // validate if this is a valid element for our case:
  if (targetElement && targetElement.classList.contains("dropZone")) {
  }

JSP64 的答案并没有完全奏效，因为event.originalEvent总是返回undefined. 如下的轻微修改现在可以工作了。

var myLocation = event.touches[0];
var realTarget = document.elementFromPoint(myLocation.clientX, myLocation.clientY);