移动Safari - “touchend”最后一次触摸被删除时事件不触发？ [英] Mobile Safari - "touchend" event not firing when last touch is removed?
问题描述
我想要捕获的手势是一个水龙头，但只有当一个元素（其他或相同）已经有一个触摸。因此，触摸（1）按下按钮，而触摸（2）轻触选择的选项，触摸（1）释放和按钮被按下。
The "gesture" I'm trying to capture is a tap when but only when an element (other or same) already has a touch on it. So, touch (1) presses the button down while touch (2) taps to selected options, touch (1) releases and button is depressed.
我遇到的问题是最后一个位。当我释放最后一根手指时，touchend事件不会被触发？所以我没有办法按下按钮？
The problem I'm having is with the last bit. The "touchend" event is not being fired when I release the last finger? So I have no way of depressing the button?
..还有touchend事件总是有touches.length = 0？
..also the "touchend" event always has touches.length = 0?
这里是一些代码，所以你可以看到我的意思。我认为这可能是移动safari中的错误？
Here is some code so you can see what I mean. I think this may be a bug in mobile safari?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Multi-touch problem</title>
<style>
#touchpane{
width:900px;
height:500px;
background-color:#333;
}
</style>
</head>
<body>
<div id="touchpane" click="void();"></div>
<script>
var tp = document.getElementById("touchpane");
tp.addEventListener('touchstart', function(e){
e.preventDefault();// to stop copy and paste
console.log("touchstart " + e.touches.length );
}, false)
tp.addEventListener('touchend', function(e){
console.log("touchend " + e.touches.length );
// not called when last finger removed?
}, false)
tp.addEventListener('touchcancel', function(e){
console.log("touchcancel");
}, false)
</script>
</body>
</html>
推荐答案
我可以帮你解决一个问题，不知道为什么touchend不会触发，当两个手指离开屏幕，当我运行你的代码上面的touchend触发时，任何一个手指离开屏幕（在iPhone 4）
I can help you with one problem, but I don't know why the "touchend" isn't firing when both fingers leave the screen, when I run your code above, the "touchend" fires when either finger leaves the screen (on an iPhone 4)
1）虽然iPhone的touchendjavascript事件有touches属性，但当最后一根手指离开屏幕时，它总是空的，因为iPhone的touches代表手指当前触摸屏幕，并且touchend仅在手指离开屏幕后触发。因此，touchende.touches.length将在最后一根手指抬起时始终为0.
1) While the "touchend" javascript event for iPhone does have the "touches" property, it's always going to be empty when the last finger leaves the screen, because "touches" for the iPhone represents fingers currently touching the screen, and "touchend" only fires after a finger leaves the screen. So on "touchend" "e.touches.length" will always be 0 when the last finger is lifted.
2）您可以访问哪些触摸已在 touchend事件通过使用changedTouches属性。这是有问题的，因为它的行为不是很一致。
2) You can access which touches have changed in the "touchend" event by using the "changedTouches" property. This is problematic because it's behaviour is not very consistent.
如果你用一个手指触摸屏幕，然后另一个，然后你删除一个手指，一些事情可以
If you touch the screen with one finger, then another, and then you remove one finger, a number of things could happen.
如果您在移除第二根手指后，第一根手指没有任何变化，则touchend中的事件对象将具有touches.length = 1 （手指仍在屏幕上）和changedTouches.length = 1（离开屏幕的手指）。
If you when you have removed the second finger, nothing has changed about the first finger, your event object in "touchend" will have "touches.length = 1" (the finger still on the screen) and "changedTouches.length = 1" (the finger that left the screen).
但是，如果您移动第一根手指（甚至一点），当你移除第二根手指，然后在touchend你的事件对象将有touches.length = 1（手指仍然在屏幕上）和changedTouches.length = 2屏幕+第一根手指的移动）。
However, if you are moving the first finger (even a bit) when you remove the second finger, then on "touchend" your event object will have "touches.length = 1" (the finger still on the screen) and "changedTouches.length = 2" (the finger that left the screen + the movement of the first finger).
我发现这篇文章非常有帮助：
I found this article very helpful:
http：//m14i.wordpress。 com / 2009/10/25 / javascript-touch-and-gesture-events-iphone-and-android /
这篇关于移动Safari - “touchend”最后一次触摸被删除时事件不触发？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
