経緯
エミュレータでは動作していたクリックイベントが実機のiPhoneで動作確認した際、動作せず…
中々デバッグが難しいという状況もあり、Google先生に聞きまくることにしました。
結論
ルート要素にbodyやdocumentなどを指定し、クリックを想定していないタグのidやclassに対してイベントを付与していたため。
(divタグ、pタグ、spanタグなどに対してイベントを付与すると起こる)
実装
テンプレート側
index.html
<div class='contents'>
<div class="icon"><span class='open'></span></div>
</div>
変更前
controller.js
$('document').on('click','.icon .open',function(){
open();
});
変更後
controller.js
$('.contents').on('click','.icon .open',function(){
open();
});
補足
・参考記事によるとその他の解消方法もあるようですが、今回は上記で解決したのでそちらで。
参考記事
Qiita記事
iOS で click イベントがわけのわからない動作をする件について
iOS で、要素をタッチしてもクリックイベントが発生しない問題への対処