前段時間筆者跟同事一起開發移動端H5界面,後來在測試時,發現一些界面的onclick事件在蘋果ios上不管用,因爲筆者跟同事之前一直做PC端開發,不太清楚怎麼回事,於是在網上找到如下幾種方案:
一.修改css方法
將綁定事件的span元素添加 z-index 跟cursor:pointer,這個沒管用
二.修改onclick的綁定
直接把onclick事件換成
$('span').on('tap',function(){})
後來才知道需要引入第三方纔能使用tap事件,我們引用了mui.js,(此處不要吐槽我們的技術棧,畢竟我們這個項目........哈哈)
三,最後的解決方案
$('body').on('tap','.map-tips-right',function(){
});
這個span元素是下圖地圖中的詳情
四.解決方案參考的內容
使用touch系列事件,但是touch系列事件有點擊穿透問題,解決方案如下
把頁面內所有的click全部全稱touch事件(touchstart,touchend,tap),需要特別注意a標籤,它的href也是click,需要去掉(href="####"或href="javascript:void(0)"),換成js控制跳轉,或者直接改成span+tap控制跳轉(這個是筆者提及的第三條我們應用的解決方案).如果要求不高,不在乎滑走或者滑進來觸發事件的話,使用span+touchend就可以了,畢竟tap需要引入第三方庫
ps:找不到第四所列的那篇文章鏈接, 在這謝謝那位作者o(*￣︶￣*)o