1

我目前正在按照响应式设计+移动优先的方法重新设计网站。

我正在尝试在支持触摸的设备上使用 JS 检测滑动事件。为此，我使用以下代码：

document.addEventListener ('touchstart', function(event) {
    //Get initial finger coords
}, false);

document.addEventListener ('touchmove', function(event) {
    //Update final finger coords
}, false);

document.addEventListener ('touchend', function(event) {
    //Compare initial and final coords, trigger swipe events if necessary
}, false);

我已经在 iPad 1、iPhone 4 和几台运行 Android 2.2.1 的设备上测试了这段代码，当我在屏幕上拖动手指时的结果是我所期望的：touchmove事件触发了几次（它很容易上升做长手势时到一百）。

当我在 Android 2.3.3 设备（我使用的是三星 Galaxy S2）上测试它时，问题就出现了。使用其原生浏览器，touchmove事件数量减少到只有 1 个（或很少 2 个）。

我做错了什么还是应该表现得像那样？有没有人发现同样的问题？touchmove我无法在此版本的 Andriod 中找到有关事件行为的文档。

您可以在这里测试它（使用支持触摸的设备）：http: //jsfiddle.net/xs5BG/embedded/result/

4

3 回答 3

2

滚动开始工作后，galaxy S2 似乎没有触发 touchmove。如果您执行 preventDefault 它会按预期触发事件。

于 2012-06-07T19:02:09.640 回答
0

用我的 HTC Desire Z（运行 2.3.3）测试你的 jsFiddle 示例，我得到的不仅仅是一个 touchmove 事件——如所愿。所以我无法重现您使用此设备的实际问题，尽管在相同的 API 级别:( 有趣的是，您的代码还显示了我在当前项目中遇到的问题：第一个 touchmove 事件似乎有某种阈值：

放下手指并且只移动一点点就会产生 0 个 touchmove 事件……一旦超过阈值，它将以毫秒为间隔触发 touchmove 事件，因为它会识别移动的每个像素距离（就像它应该做的那样）。也许这可能与您的现象有关，您是否也在您的 2.3.3 设备上看到了这一点？

于 2012-05-28T13:53:37.873 回答
0

在许多 Android 版本上，如果您在 touchstart 上不阻止默认设置，Android 设备将进入默认滚动模式并停止向 webview 发送触摸事件。所以你需要

document.addEventListener ('touchstart', function(event) {
    event.preventDefault();
}, false);

现在所有的触摸事件都将触发，但默认滚动将被禁用。

有一个垫片可以克服这个问题，它模拟滑动手势https://github.com/TNT-RoX/android-swipe-shim

于 2014-08-06T08:20:54.683 回答