jQuery:$(document).on('click', '.class', handler);がiPhoneで動かない問題

jQuery:$(document).on('click', '.class', handler);がiPhoneで動かない問題

author : koki

publish date :

非常に地味なエラーですが、以下の書き方だとiPhoneでclickイベントが認識されませんでした。

問題の出るコード

本来クリック出来ないタグ(pタグとか)にclickイベントを割り当てようとし、下記コードで実装した場合にiPhoneのみでclickイベントが動きません。

$(document).on('click', '.class', function(){
	// 処理
});

対処法

これの対処法は、HTMLやJS側ではなく、CSSのみで対応可能です。
しかもたった1行。
clickイベントを割り当てようとする、要素に以下のスタイルを追加してください。

cursor: pointer;

最後に・・・

対象のタグをaタグに変えたり、JSスクリプトを書き換えるたりすることでも対応可能ですが、CSSの1行追記で済むのであれば楽な方がいいですよね。
CSSにcursor: pointer;を足すことで、カーソルが手アイコンに変わりクリックできる雰囲気は出ますが、問題の出るのはカーソルの種類なんて関係ないスマホなんだよなぁ~。
この問題は調べるのが厄介そうなので、深く追求しないことにします。

にしてもなんで動かないんだろ、バグなのかなー?