2013年2月27日水曜日

DOMに対してい任意イベントを発生させる(タッチディバイスの場合)

タッチディバイスの場合、GoogleMapAPIで地図を表示している部分では、MouseEventのclickではイベントをキャッチしてもらえないようだったので、専用にタッチイベントを起こしてみた。

TouchEventはDOMでは規定されていないので、プラットフォーム別に初期化の仕方が違うみたいなので、とりあえず手持ちで確認できたAndroidとiOSむけだけ。
PC向けのブラウザでは動かない。


イベントとしては
touchstart
touchmove
touchend
の3つがあるみたい。
タッチディバイスによっては、マルチタッチをサポートしているものがあるので、タッチイベントは配列で指定することになる。

GoogleMapAPIで地図のクリックイベントとして登録した処理は、はtouchstartだけでは実行してくれなかったので、touchstartの後にすぐにtouchendを発行してみたらちゃんと処理された。


-------ここから-------
var evt=document.createEvent('TouchEvent');
var event2=document.createEvent('TouchEvent');
var touch = document.createTouch(window,elements, 0, x, y, x, y);
var touches = document.createTouchList(touch);
                   
[Androidの場合]

evt.initTouchEvent(touches, touches, touches, 'touchstart', window, x,y, x, y, false, false, false, false);
event2.initTouchEvent(touches, touches, touches, 'touchend', window, x,y, x, y, false, false, false, false);

[iOSの場合]
 evt.initTouchEvent('touchstart', true, true, window, 0, x,y,x, y, false, false, false, false, touches, touches, touches,1, 0);
 event2.initTouchEvent('touchend', true, true, window, 0, x,y,x, y, false, false, false, false, touches, touches, touches,1, 0);


elements.dispatchEvent( evt );
elements.dispatchEvent( event2 );
-------ここまで-------

0 件のコメント: