javascript ios webkit中的touchend事件没有触发？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7691551/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
touchend event in ios webkit not firing?
提问by Craig
I'm trying to implement a menu for a ios webkit based app in which the user touches/clicks and holds a menu button ('.menu_item'), after 500ms the sub menu opens (div.slide_up_sub_menu), and a user should be able to slide their finger/mouse up to a submenu li item and release.
我正在尝试为基于 ios webkit 的应用程序实现菜单，其中用户触摸/单击并按住菜单按钮（'.menu_item'），500 毫秒后子菜单打开（div.slide_up_sub_menu），并且用户应该是能够将手指/鼠标向上滑动到子菜单项并释放。
<li class="menu_item">
ASSET MANAGEMENT
<div class="slide_up_sub_menu hidden_menu">
<ul class="submenu">
<li>Unified Naming Convention</li>
<li>Version Control</li>
</ul>
</div>
</li>
The application should then be able to detect which submenu item the touchend/mouseup event happened on. I'm binding a touchstart event to the menu item, waiting for 500ms, and afterwards telling the submenu to show. When a user releases their finger a touchend event should fire closing the submenu. If the user has stopped their touch on a submenu item it should be detected. Currently detection of which submenu item a mouseup event happened on works in Safari on the desktop:
然后应用程序应该能够检测到 touchend/mouseup 事件发生在哪个子菜单项上。我将 touchstart 事件绑定到菜单项，等待 500 毫秒，然后告诉子菜单显示。当用户松开手指时，应该触发一个 touchend 事件来关闭子菜单。如果用户停止了对子菜单项的触摸，则应检测到该子菜单项。目前在桌面上的 Safari 中检测发生了 mouseup 事件的子菜单项：
$('ul.submenu li').live('mouseup', function(e){
console.log($(e.currentTarget)); //works on the desktop
});
but if I do the same using a touchend handler it doesn't work on an ipad:
但如果我使用 touchend 处理程序做同样的事情，它在 ipad 上不起作用：
$('ul.submenu li').live('touchend', function(e){
console.log($(e.currentTarget)); //never fires
});
if I look for every touchend event I can get a reference to the parent sub menu item when I end the touch on a submenu item:
如果我查找每个 touchend 事件，当我结束对子菜单项的触摸时，我可以获得对父子菜单项的引用：
$(document.body).bind('touchend', function(e) {
console.log($(e.target).html()); //logs ASSET MANAGEMENT
});
but no reference to the submenu item.
但没有提及子菜单项。
Does anyone have any idea why a touchend event is not being fired on the submenu items?
有谁知道为什么没有在子菜单项上触发 touchend 事件？
Thanks
谢谢
回答by Stefan
touchend does not fire because touchcancel has fired earlier. If you want full touch evens handling you need to call
touchend 不会触发，因为 touchcancel 已经触发。如果你想要全触摸事件处理，你需要打电话
e.preventDefault()
in the callback of "touchmove" event, otherwise when a touchmove event occurs if the browser decides that this is a scroll event it will fire touchcancel and never fire touchend.
在“touchmove”事件的回调中，否则当发生 touchmove 事件时，如果浏览器确定这是一个滚动事件，它将触发 touchcancel 并且永远不会触发 touchend。
回答by user1368691
Maybe it's a bit late to answer. This event will never fire, because touch events fire on the very element on which touchstart happened. So, to do what you want to, one solution is to use document.elementFromPoint method, to which you will send appropriate x and y coordinates.
可能现在回答有点晚了。此事件永远不会触发，因为触摸事件会在发生 touchstart 的元素上触发。因此，要做您想做的事情，一种解决方案是使用 document.elementFromPoint 方法，您将向该方法发送适当的 x 和 y 坐标。
回答by roee
If you don't need to use multitouch data, you may keep using mouseup on ipad.
如果您不需要使用多点触控数据，您可以继续在 ipad 上使用 mouseup。
further reading: http://developer.apple.com/library/IOS/#documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html
进一步阅读：http: //developer.apple.com/library/IOS/#documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html
