IScroll5+在ios、android点击(click)事件不兼容解决方法

IScroll5+在ios、android点击(click)事件不兼容解决方法

 

之前在没有接触 ionic 的时候,移动端的处理好多使用 IScroll 来解决问题,但是众所周知这个插件好用也有很多兼容问题。移动端页面滑动的流畅度至关重要,IScroll 插件在一定程度为开发者解决了这个问题,但是老外的这款插件挖的坑的确不少。这篇文章重点讲下click事件的bug。(测试均基于手机原生浏览器

Bug描述:

ios、android4.4+下不能触发click事件。

Bug解决:

调用iscroll插件,增加配置参数:click:true/false

click的值是要根据移动终端设备进行判断,如果只是简单的判断终端类型的话,android4.4+还是不能点击,这就是安卓的一个坑,毕竟没有IOS系统做的统一。

故增加一个函数去判断:

function iScrollClick(){
	if (/iPhone|iPad|iPod|Macintosh/i.test(navigator.userAgent)) return false;
	if (/Chrome/i.test(navigator.userAgent)) return (/Android/i.test(navigator.userAgent));
	if (/Silk/i.test(navigator.userAgent)) return false;
	if (/Android/i.test(navigator.userAgent)) {
	   var s=navigator.userAgent.substr(navigator.userAgent.indexOf('Android')+8,3);
	   return parseFloat(s[0]+s[3]) < 44 ? false : true
    }
}

配置实例:

 myScroll = new IScroll("#ID", {
	click:iScrollClick(), //调用判断函数
        scrollbars: true,//有滚动条
        mouseWheel: true,//允许滑轮滚动
        fadeScrollbars: true//滚动时显示滚动条,默认影藏,并且是淡出淡入效果
    });

    

 

祝大家学习愉快哦!猴年大吉!

站内部分资源收集于网络,若侵犯了您的合法权益,请联系我们删除!
赞赏是最好的支持
如果对你有帮助那就支持一下吧
立即赞赏
分享到:
赞(4) 打赏

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

小月博客-一个专注于分享的技术博客
没有账号? 忘记密码?