javascript - Win 8 应用程序在手指滑动时触发事件

Question

当用户在指定的 div 上滑动手指时，我想触发一个事件。例如：当用户在 div 上滑动手指时，应调用特定函数。

Answer 1

这将添加事件处理程序：

document.getElementById('divId').addEventListener('mspointermove', handler, false);

然后您必须识别它是触摸事件还是鼠标事件。

function handler(event) {
    if (eventObject.pointerType === 2) {
        // touch event
    }
}

这是触摸事件的完整指南。msgesturestart/change/end 可能是您想要使用的。

Answer 2

您需要使用 WinRT 的完整手势识别器功能以获得最佳体验。MSDN 在这里有一个完整的示例。然后，这将允许您获取 DIV 的操作并根据需要使用它。一个简单的演练就在这里。注意需要：

1. 创建一个 MSGesture 对象
2. 捕获 MSPointerDown，并将指针 ID 添加到 1 中创建的手势实例。

另一个考虑因素是查看您的体验并考虑是否使用强制捕捉点，并且滚动条中的多个项目可能适合您的体验。

一些示例代码：

<div id="touchMe" style="width:500px; height: 500px; background-color: yellow; "></div>

JavaScript，当 touchMe 可用时运行：

var v = document.getElementById("touchMe");
v.addEventListener("MSGestureStart", function () {
    console.log("foo");
});

var gestureThing = new MSGesture();
gestureThing.target = v;
v.dooHicker = gestureThing;

v.addEventListener("MSPointerDown", function (e) {
    gestureThing.addPointer(e.pointerId);
    console.log("down");
});

v.addEventListener("click", function () {
    console.log("click");
});