监听touchend事件有时会触发移动设备上的click事件

Question

我正在使用PhoneGap开发一个应用程序。

我正在监听touchstart / touchend事件以使其响应。

有时，touchend的事件监听器会触发，但之后，例如，随着点击事件在300毫秒后触发，输入框会获得焦点。

例如，我有一个菜单侧边栏。每个侧边栏列表项都会监听touchend事件。接收事件后，侧边栏将关闭并显示相关页面。但是，如果相关页面包含用户为侧边栏列表项单击的表单元素，则该表单元素将获得焦点。

在整个应用程序中停止这种情况的最佳方法是什么？不同手机的情况各不相同。

我尝试过stopPropagation等操作，但这些只在一些情况下起作用，而我需要一个通用的跨应用程序解决方案，而不是为每个函数添加代码（如果可能）。

类似于：

$('body').on('touchend', function(){
    //stop any further touchends/ clicks from firing
    //apart from the 1 i do want
})

- rpsep2

---

你尝试过使用 event.preventDefault() 吗？ - Manishearth

你应该看一下hammer.js - 它可以为这种事情做所有的繁重工作。 - CodingIntrigue

嗨，有时候这个可以工作，但似乎并不适用于每种情况。编辑：对于preventDefault()选项。 - rpsep2

Answer 1

你的应用程序运行得太快了 ;) 简单方法： 在每个按钮/菜单操作上放置setTimeout(gotopage(),100)

困难方法： 如果你真的不想使用setTimeout，你应该看一下冒泡是如何工作的，问题就在这里

提示： 无论如何，为了避免300毫秒的延迟，你应该使用FTLABS的Fastclick： https://github.com/ftlabs/fastclick 并使用click事件，它会为你完成任务（你仍然需要使用setimeout技巧）

- Reign.85

Answer 2

你可以尝试使用'touchcancel'代替'touchend'，看看是否有效 :) 祝好运。

- Holybreath