最新消息:欢迎大家来到小月博客

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

web前端 小月 2268浏览 0评论

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//滚动时显示滚动条,默认影藏,并且是淡出淡入效果
    });

    

 

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

转载请注明:小月博客 » IScroll5+在ios、android点击(click)事件不兼容解决方法

一点心意×
 收藏 (0)
发表我的评论
取消评论
表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册