web-dev-qa-db-ja.com

touchendイベントのプロパティ

モバイルデバイスからのすべてのタッチエンドイベントを次のようにキャッチした場合:

$(document.body).bind('touchend', function (e) {
var touch = e.touches[0]; // doesnt work
...

Eパラメーターからtouch.screenX、touch.screenY、touch.clientX、およびtouch.clientXを取得する必要があります。私が見たすべての例は、e.touchesがコレクションになることを示唆しており、e.touches[0]。 iPadでのテストでは、e.touchesは常に未定義です。 jqueryプラグインを使用していません。

E.targetTouchesも試してみましたが、これも未定義です。

誰でも助けることができますか?

48
Matt Roberts

実際、リリースされたタッチは、changedTouches配列にあります。つまり:

e.changedTouches[0].pageX // get the end x page coordinate for a released touch

これは、originalEventプロパティを使用するよりも若干信頼性が高いと思います。

ChangedTouchesの詳細については、こちらをご覧ください: http://www.w3.org/TR/touch-events/#changedtouches-of-a-touchevent

98
Gopherkhan

TouchesプロパティはTouchListオブジェクトです。 TouchListクラスのリファレンス here をご覧ください。

#log divの次のサンプルコードでその長さプロパティを監視する場合:

$('#element').bind('touchstart', function(event) 
{
    $('#log').append(event.originalEvent.touches.length+'<br/>');
});

$('#element').bind('touchmove', function(event) 
{
    $('#log').append(event.originalEvent.touches.length+'<br/>');
});

$('#element').bind('touchend', function(event) 
{
    $('#log').append(event.originalEvent.touches.length+'<br/>');
});

touchstartとtouchmoveの実行中に1を取得し、touchendの実行中に0を取得します。そのため、e.touches[0]からundefinedを取得します。

10
javibilbo