FastClick使用之trigger触发click失效

最近为了提升web app在ios上的点击效率,使用了FastClick.js,效果很明显,基本是点击后立马有反馈。可是发现一个问题,在使用模拟点击的时候,并不能触发点击的目的。
$("#btn").trigger("click");//模拟点击
而以上代码,在安卓上,却能正常触发。
于是百度查找了相关的资料,找到以下内容(引用自http://amazeui.org/1.x/javascript/fastclick/)
不应用 FastClick 的场景
 
桌面 浏览器
如果 viewport meta 标签 中设置了 width=device-width, Android 上的 Chrome 32+ 会禁用 300ms 延时;
 Copy
<meta name="viewport" content="width=device-width, initial-scale=1">
viewport meta 标签如果设置了 user-scalable=no,Android 上的 Chrome(所有版本)都会禁用 300ms 延迟。
IE10 中,可以使用 css 属性 -ms-touch-action: none 禁止元素双击缩放(参考文章)。
根据上面描述,终于知道在安卓之所以能生效,是因为属于FastClick不应用的场景,而 IOS则应用上了FastClick的效果。于是跟踪代码,各种调试,发现了在ios上,需要调用“模拟两次触发”才能完成一次真正的点击事件;
于是写了如下扩展:
var notNeed = FastClick.notNeeded(document.body);
$.fn.triggerFastClick=function(){
    this.trigger("click");
        if(!notNeed){
        this.trigger("click");
    }
}
需要用到模拟点击事件的时候,就使用$("#btn").triggerFastClick()来代替原来的trigger("click");
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值