代码之家 › 专栏 › 技术社区 › ad rees

移动Safari-“touchend”事件在最后一次触摸被移除时未触发?

mobile-safari cordova ipad javascript

ad rees · 技术社区 · 16 年前

我的问题是最后一点。当我松开最后一根手指时,“touchend”事件没有被触发?所以我没办法按下按钮?

这里有一些代码让你明白我的意思。我想这可能是移动safari中的一个bug?

<!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>

2 回复 | 直到 12 年前

JoeDuncan 15 年前

我可以帮你解决一个问题,但我不知道为什么当两个手指离开屏幕时“触摸端”没有启动,当我运行上面的代码时,“触摸端”会在任何一个手指离开屏幕时触发(在iphone4上)

1) 虽然iPhone的“touchend”javascript事件确实具有“touchend”属性,但当最后一个手指离开屏幕时,它总是空的,因为iPhone的“touchend”代表当前触摸屏幕的手指,“touchend”只会触发之后手指离开屏幕。在“touchend”“e”上。接触长度“当最后一根手指抬起时,将始终为0。

2) 您可以使用“changedtouchs”属性访问“touchend”事件中已更改的触摸。因为这不是很有问题的行为。

如果移除第二根手指后,第一根手指没有任何变化,“touchend”中的事件对象将具有接触长度=1“(手指仍在屏幕上)和”更改触摸长度=1“(离开屏幕的手指)。

但是,如果您在移除第二个手指时移动第一个手指(甚至一点点),那么在“touchend”上,您的事件对象将具有接触长度=1“(手指仍在屏幕上)和”更改触摸长度=2“(离开屏幕的手指+第一个手指的移动)。

我觉得这篇文章很有帮助:

http://m14i.wordpress.com/2009/10/25/javascript-touch-and-gesture-events-iphone-and-android/

tschubring 15 年前

touchend类型的TouchEvent总是有e。接触长度第0页

缺少的最后一个touchend事件可能取决于触摸的目标。如果两个手指同时抬起,并且两个手指都有相同的目标,那么只有一个触控端会发射,但它会同时在e.changedTouches对象中进行两次触碰。如果目标不同,那么您将看到两个touchend事件,每个事件在changedTouches对象中都有关联的touch。

此外,最令人费解的是,当你举起两个手指中的一个时,你会得到和你同时举起两个手指一样的行为。然后,当剩下的手指移动时,它将启动另一个触摸启动,触摸时该手指的原始标识符。其结果是,在触摸结束时,直到经过任意时间(当剩余的手指移动时),才有办法判断哪个触摸已经结束。

为了验证这一点,您需要记录每个事件中的接触列表。我找到的唯一解决方法是一个clude,我缓存touchstart事件,设置间隔半秒,然后希望剩下的手指触发了一个可以用来协调状态的touchstart。好悲伤!