javascript - JS 触摸事件 : Y Coordinates greater than Window Height

Question

我正在尝试了解有关触摸事件的更多信息，特别是在 iOS 7 中进行测试。我已经 fork 了我正在进行的工作以演示我遇到的问题:

(笔不再可用)

窗口高度是在页面加载时测量的，并显示在“高度统计”中。所以，我的想法是最大 pageY 值将等于窗口高度。然而，当我滚动页面并开始新的触摸时，pageY 坐标反射(reflect)了整个文档的像素距离，而不是窗口“框架”。

这似乎会导致报告不正确的值。当您继续在窗口上下移动手指时，moveY 将卡在大约 10px 的范围内(startY = 374，moveY 保持在 366 和 376 之间)。我不确定为什么会发生这种情况......但更大的问题是为什么 pageY 不限于窗口框架？

这是一个仅显示触摸事件捕获的片段:

var startY, moveY;

$(window).on('touchstart', function(e) {
    startY = e.originalEvent.targetTouches[0].pageY;
});

$(window).on('touchmove', function(e) {
    moveY = e.originalEvent.targetTouches[0].pageY;
});

$(window).on('touchend', function(e) {
    endY = moveY;
});

Answer 1

经过更多挖掘，我发现不仅仅是page 坐标对象。我们还有屏幕和客户端。通过测试，我看不出screen 和page 有什么区别，但是client 似乎给了我想要的东西。示例:

e.originalEvent.targetTouches[0].clientY;

...将始终给出窗口框架的坐标，而不是文档高度。成功!