ontouchend-ios返回错误的坐标

我一直在读一本非常有用的书《核心HTML5画布》，其中包括一个在同一函数中包含鼠标点击和触摸的示例。我的版本（与本书非常相似）如下：

function windowToCanvas(x, y) {
    var bbox = canvas.getBoundingClientRect();
    return { x: x - bbox.left * (canvas.width /bbox.width), y: y - bbox.top * (canvas.height / bbox.height)};
};
canvas.ontouchstart = function(e) {
    e.preventDefault(e);
    MTStart(windowToCanvas(e.pageX, e.pageY));
};
canvas.ontouchmove = function(e) {
    e.preventDefault(e);
    MTMove(windowToCanvas(e.pageX, e.pageY));
};
canvas.ontouchend = function(e) {
    e.preventDefault(e);
    MTEnd(windowToCanvas(e.pageX, e.pageY));
};
canvas.onmousedown = function(e) {
    e.preventDefault(e);
    MTStart(windowToCanvas(e.pageX, e.pageY));
};
canvas.onmousemove = function(e) {
    e.preventDefault(e);
    MTMove(windowToCanvas(e.pageX, e.pageY));
};
canvas.onmouseup = function(e) {
    e.preventDefault(e);
    MTEnd(windowToCanvas(e.pageX, e.pageY));
};
function MTStart(location) {
    console.log("Mouse down");
    document.getElementById('message').innerHTML = 'MT Start x: ' + location.x + ', y: ' + location.y;
};
function MTMove(location) {
};
function MTEnd(location) {
    console.log("Mouse up");
    document.getElementById('message').innerHTML = 'MT End x: ' + location.x + ', y: ' + location.y;
};

这适用于鼠标。然而，在iphone或ipad上运行safari时，ontouchstart似乎报告了正确的位置，而ontouchend则没有。无论我触摸到哪里，Ontouchend都会给出相同的坐标。我注意到，当并且只有当我稍微滚动页面并触摸画布中的相同位置时，它返回的坐标似乎会发生变化。

知道为什么ontouchstart和ontouchend会给出不同的位置值吗？

谢谢！