ios11.3下fastClick相关bug

首先了解一下加入faskclick这个库解决的问题:

  • click 300ms延迟:浏览器click会比touch延迟300ms触发
  • click穿透现象:当两个div同处一个position,上层div绑定touch,下层div绑定click,当上层div触发touch消失后,可能会触发下层div的click事件

bug描述:在页面浮层中,存在输入框,在使用fastClick后,导致输入框难以focus

解决方案:

import FastClick from 'fastclick'
import Helper from '@/util/helper'

FastClick.prototype.focus = function(targetElement) {
    var length;
    //兼容处理:在iOS7中,有一些元素(如date、datetime、month等)在setSelectionRange会出现TypeError
    //这是因为这些元素并没有selectionStart和selectionEnd的整型数字属性,所以一旦引用就会报错,因此排除这些属性才使用setSelectionRange方法
    if (Helper.UA.isIos && targetElement.setSelectionRange && targetElement.type.indexOf('date') !== 0 && targetElement.type !== 'time' && targetElement.type !== 'month' && targetElement.type !== 'email') {
        length = targetElement.value.length;
        targetElement.setSelectionRange(length, length);
        /*修复bug ios 11.3不弹出键盘,这里加上聚焦代码,让其强制聚焦弹出键盘*/
        targetElement.focus();
    } else {
        targetElement.focus();
    }
};

export default FastClick

参考资料:iOS11.3 fastclick.js相关bug剖析

你可能感兴趣的:(ios11.3下fastClick相关bug)