前言
前段时间针对webApp里click事件300ms延迟的问题做了比较深入的研究,不过最近有用户反映在iPhone的Safari浏览器里点击页面会出现闪屏的问题(什么是闪屏呢?我这边简单解析是快速点击屏幕并放开之后屏幕会闪烁一下),这个问题偶尔一两次出现还好,但现在反映几乎每个用quickOn绑定click事件的图标点击都出现这个问题。
解释
quickOn绑定click事件的原理是在移动设备里 通过touchstart->touchend事件模拟click事件,而Safari浏览器对这个事件定义了自己的默认行为(“闪屏”)?,这个猜测很快被肯定是正确的。因为在Android的浏览器和webview里并没有出现类似的问题,这又牵涉到浏览器兼容的大头了。不过但是既然是兼容问题,只要把Safari的特性屏蔽掉不就行了?
解决方案
下面是个代码片段:
$('#art-content').quickOn('click', '#btn-relative', function(e) {
e.preventDefault();//没错,又是它!一行就够了
//.....
});
这里还要注意一下,根据实际需求使用e.preventDefualt()
,因为Safari的其他特性对用户体验友好性还是挺给力的。
好吧,就这么简单。 * _ * ,简直被自己蠢哭了