Question

屏幕上有两个正方形。每个都有一个touchmove事件。当我在手机上运行时，我想让它返回我手指的正确X位置。如果我一次做一个方格（即只有一个手指只在屏幕上），它工作正常。但是如果我在每个方格上都有两个手指并且我同时移动它们，那么X会搞砸了。这是处理多点触控x的正确方法吗？

HTML：

<div id='container1'></div>
<div id='container2'></div>

的javascript：

$('#container1').bind('touchmove', function() {        
            console.log("container1-" + event.pageX);
            event.preventDefault();
    });


$('#container2').bind('touchmove', function() {
        console.log("container2-" + event.pageX);
       event.preventDefault();
    });

的CSS：

#container1 {
    margin:50px;
    width:300px;
    height:300px;
    background:red;
}

#container2 {
    margin:50px;
    width:300px;
    height:300px;
    background:green;
}

我的jsfiddle在这里： http://jsfiddle.net/foreyez/jghzqL9p/

如果您按下＆＃39;运行＆＃39;旁边的移动图标，则可以在移动设备上运行它按钮。

Answer 1

当您处理触摸事件时，您应该使用“已更改的内容”。事件对象的属性。它是所有当前触摸的列表，包含标识符（标识触摸 - 您的手指），pageX，pageY等参数。

为了全面了解多点触控，我会重新阅读this MDN article。

Answer 2

是的。根据Maxim的建议，您应该使用changedTouches来读取多个触摸。 “changedTouches”中的点对touchstart，touchend和touchmove事件有不同的含义。

如果您尝试交换或移动对象，那么您应该使用'touchstart'和'touchmove'的组合来到达对象的最终位置。

touchmove事件是否支持多点触控？

2 个答案: