[JavaScript] iPhone、アンドロイドでのクリックイベント

スマートフォンでonclickなどのクリックイベントを設定しようとすると、どうにも動きがもっさりする。

理由はダブルクリックかどうかの判定をするために、コンマ数秒待つからみたい。
これだと気持ちいい動きが実現できないので、スマートフォンではonclickではなく、ontouchendを使ったほうがいい。
そうすれば指を離した時点で、ダブルクリックかどうかの判定を待つことなくイベントが発生する

気になる点と言えば、スクロールして指を離した時にもこのイベントが発生すること。
どこかリンクなどの上にタッチしてスクロール→指を離した時点でイベント発生！
これはユーザーが意図した動きではなさそうなので、スクロールした場合はイベントは発生しないようにしといたほうがいい

タッチ系のイベントは3つ
ontouchstart
ontouchmove
ontouchend

view plainprint?

1. //スクロールしたかどうかの判定フラグ  
2. var touchMoveFlag = false;  
3.   
4. element.ontouchmove = function(){  
5. 　//touchMoveイベントが発生したらフラグをたてる  
6.   touchMoveFlag =true;  
7. }  
8.   
9. //指を離した時の処理  
10. element.ontouchend = function(){  
11.   
12.   //スクロールしてから指を離した場合は何もしない  
13.   if(touchMoveFlag){  
14.     touchMoveFlag = false;  
15.     return false;  
16.   }  
17.   
18.   //スクロールしなかった(通常のクリックと同じ扱い)  
19. //ここに処理を書く  
20.   alert("クリックしたと判定しますよ" );  
21.   
22.   //指を離したあとなのでフラグはひっこめる  
23.   touchMoveFlag = false;  
24. }  

//スクロールしたかどうかの判定フラグ
var touchMoveFlag = false;

element.ontouchmove = function(){
　//touchMoveイベントが発生したらフラグをたてる
  touchMoveFlag =true;
}

//指を離した時の処理
element.ontouchend = function(){

  //スクロールしてから指を離した場合は何もしない
  if(touchMoveFlag){
    touchMoveFlag = false;
    return false;
  }

  //スクロールしなかった(通常のクリックと同じ扱い)
//ここに処理を書く
  alert("クリックしたと判定しますよ" );

  //指を離したあとなのでフラグはひっこめる
  touchMoveFlag = false;
}

ontouchendだとダブルクリック判定ができないので、そこは注意。

参考：
[javascript]iPhone clickイベント