sakura*sakura

jQueryで、on()にclickとhoverを設定して、同じ処理をしたい【jQuery】
この記事の続き。

「.on('click mouseenter',～)」で解決した　ハズだった。

スマホで見てみると、クリックした時の、微妙に反応の鈍さ（遅さ）が気になる。
　↓
調べると、スマホでのclickは、タイムラグが発生するらしい。
　↓
じゃあ、スマホのためにタップ系の「touchstart」イベントも設定に追加するンゴ！
「.on('click mouseenter touchstart',～)」、と。
　↓
あ、あれ・・・？スマホのブラウザで確認すると、タップした時の挙動が変。。

・・・スマホの時だけ、eventが２度呼ばれてるっぽい？？（汗）

はぁ。
対応しますとも。。

｜不具合対応｜ λ............ (ﾄﾎﾞﾄﾎﾞ)

そして完成したのが、これ！！

// clickイベントでの処理（mouseenter は省略）
var clickEventType=((window.ontouchstart!==null)?'click':'touchstart');
$("#test").on(clickEventType, function() {
	// クリック、タップ時の処理を記述
});

click and hover（mouseenter）イベントで処理したい場合

ついでに、click and hover（mouseenter）イベントで処理したい場合はこちら。

// click and hoverイベントで処理したい場合はこちら
var clickEventType=((window.ontouchstart!==null)?'click mouseenter':'touchstart');

今のところ、問題なく動作している。

スマホの場合は、clickよりも「touchstart」の方が、動作がサクサクでいいねぇ！