今天在做购物网站公众号时,首页上商品描述文字和图片点击都需要进入商品详情页,发现PC端和安卓端都可以正常跳转,iOS端点击图片可以正常跳转,点击文字则无任何反应。
jquery方法为:
$(document).on('click','.a .b',function(){
var id=$(this).attr('id');
if(id){
window.location.href="{WEB_PATH}/mobile/mobile/item/"+id;
}
});
在iOS端点击文字时根本没进入on()方法体,搜索得知微信在安卓版使用X5内核,iOS版使用自带Safari内核,最后在stackoverflow找到解决办法,原因未知。
代码修改为:
$('<span style="font-family: Arial, Helvetica, sans-serif;">.a</span>').on('click','.b',function(){
var id=$(this).attr('id');
if(id){
window.location.href="{WEB_PATH}/mobile/mobile/item/"+id;
}
});
答案来源: http://stackoverflow.com/questions/9881509/jquery-on-doesnt-work-with-mobile-safari
微信的坑:http://likr.cn/2015/12/02/%E5%BE%AE%E4%BF%A1h5%E8%B8%A9%E5%9D%91/
https://www.qianduan.net/qqliu-lan-qi-x5nei-he-wen-ti-hui-zong/
update:
方法二:
iOS(safari)有时候某个标签绑定点击事件无效,加了空的οnclick=""就好了