fastclick作用

用于消除物理敲击与click移动浏览器上的事件触发之间的300ms延迟。(https://www.npmjs.com/package...

问题:

在移动端,用了antd mobile的输入框组件,但是ios用户都反馈输入框点击不灵敏,有时候要点好几下才能点中输入框。

原因:

1.可能是样式上输入框被遮住了。
2.设备点击问题

尝试:

1.针对第一种可能,我在样式上给输入框加了z-index,还有宽高,但是问题还是有,所以排除第一种可能。

2.第二种可能是基于我用了fastclick解决点击问题。

解决方法

·1:在fastclick的源码中增加。若你npm下载了fastclick,那就去node_modules中的fastclick包中找到FastClick.prototype.focus。

FastClick.prototype.focus = function(targetElement) {
 var length;
 if (deviceIsIOS && targetElement.setSelectionRange && targetElement.type.indexOf('date') !== 0 && targetElement.type !== 'time' && targetElement.type !== 'month' && targetElement.type !== 'email') {
     length = targetElement.value.length;
     targetElement.focus();//加入这一句话就OK了
     targetElement.setSelectionRange(length, length);
 } else {
     targetElement.focus();
 }
};
 

然后每次打包的时候注意一下这个包有没有这一句。(因为我没试过这种,试过效果的朋友跟我说一下哈)

·2:不是通过npm包管理工具下载的,而是页面引入的,那就需要下载fastclick的包,然后在包里面像上一种方式一样增加一句代码(targetElement.focus())。如果项目里面有处理文件路径的那随便放fastclick包,然后改一下public/index.html的引入;如果没有文件路径处理,那fastclick在public/index.html的引入,就可能引起打包时的路径查找问题,所以我直接把fastclick的包放在public下,这样dist里面也会新增一个fastclick.


米虫
1 声望0 粉丝

下一篇 »
ios 复制异常