1、在vue项目中安装fastclick插件

npm install --save fastclick

2、在main.js中引入并绑定到body

import  FastClick  from  'fastclick'

FastClick.attach(document.body);

3、在项目中安装fastclick成功后测试会遇到以下问题:

FastClick.prototype.focus = function(targetElement) {
var length;
var deviceIsWindowsPhone = navigator.userAgent.indexOf("Windows Phone") >= 0;
var deviceIsIOS = /iP(ad|hone|od)/.test(navigator.userAgent) && !deviceIsWindowsPhone;
//兼容处理:在iOS7中,有一些元素(如date、datetime、month等)在setSelectionRange会出现TypeError
//这是因为这些元素并没有selectionStart和selectionEnd的整型数字属性,所以一旦引用就会报错,因此排除这些属性才使用setSelectionRange方法
if (deviceIsIOS && 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();
}
}
var u = navigator.userAgent;
var flag;
var timer;
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
if (isIOS) {
document.body.addEventListener('focusin', () => { //软键盘弹起事件
flag = true;
clearTimeout(timer);
})
document.body.addEventListener('focusout', () => { //软键盘关闭事件
flag = false;
if (!flag) {
timer = setTimeout(() => {
window.scrollTo({
top: 0,
left: 0,
behavior: "smooth"
}) //重点 =======当键盘收起的时候让页面回到原始位置(这里的top可以根据你们个人的需求改变,并不一定要回到页面顶部)
}, 200);
} else {
return false;
}
})
} else {
return false;
}

fastclick插件中存在的bug的更多相关文章

  1. fastclick插件 导致 input[type="date"] 无法触发问题解决方案

    鄙人才疏学浅,新人一枚,不足之处还请谅解,写下这个也只是为了给大家分享一下我解决这个BUG的方法,也是自己的一个笔记. 首先,我们使用fastclick插件的初衷是解决“tap”事件“点透”的BUG: ...

  2. gulp-px2rem-plugin 插件的一个小bug

    最近在使用这个插件的过程中发现一个bug: 不支持 含有小数的形式. 查看源码后,修改了下其中的正则,使其支持小数形式(66.66px..6px ). 作者的源码最近一次更新都在两年前,所以就简单的记 ...

  3. 添加PMD插件扫描潜在的bug

    上一节使用checkstyle来规范你的项目主要解决了代码编码规范问题,比如缩进换行等.这次继续代码健康工具类PMD. 什么是PMD PMD真的不像checkstyle这样的东西所见即所得啊,去官网找 ...

  4. 详解jquery插件中;(function ( $, window, document, undefined )的作用

    在jquery插件中我们经常看到以下这段代码 1 2 3 ;(function ( $, window, document, undefined ){ //函数体内具体代码 })(jQuery, wi ...

  5. 关于AFNetworking中header的bug问题

    关于AFNetworking中header的bug问题 [摘要:AFNetworking那个正在ios开辟中便未几道了,网上一搜一大推,然则详细用法我便没有道了,偶然间我会整顿一下详细的一些用法.本日 ...

  6. 在eclipse的maven插件中搜寻本地仓库中的jar搜索不到的解决方案

    在eclipse的maven插件中搜寻本地仓库中的jar搜索不到的解决方案 之前,用过maven管理项目的童鞋都知道本地会有一个${User_Home}.m2/repository仓库 是用来存放ja ...

  7. android插件中或者library中获取asstes文件

    在插件中或者library的项目中把文件放在asstes,不能用context.getResources().getAssets().open(fileName)读取到流,会报FileNotFound ...

  8. 关于RadAsm中GetEnvironmentStrings的BUG。

    今天在asm中不通过msvcrt.inc调用c库. 所以.第一时间就在vc的lib中拷贝了libc.lib问价.加入工程后. 声明.调用如下: 然后.链接报错. libc.lib(crt0.obj) ...

  9. 如何在Exe和BPL插件中实现公共变量共享及窗口溶入技术Demo源码

    如何在Exe和BPL插件中实现公共变量共享及窗口溶入技术Demo源码 1.Delphi编译方式介绍: 当我们在开发一个常规应用程序时,Delphi可以让我们用两种方式使用VCL,一种是把VCL中的申明 ...

随机推荐

  1. 几种主流浏览器内置http抓包工具软件使用方

    对于学习网站的人或者相关编程人员,经常需要用到http抓包工具来跟踪网页,但主流抓包软件如httpwatch.httpanalyzerstdv都是收费的,破解版往往也不稳定.实际上现在很多浏览器都内置 ...

  2. Visual studio 正在从以下位置加载符号:Microsoft符号服务器 尝试取消禁用后续符号加载

    正在从以下位置加载符号:Microsoft符号服务器   尝试取消禁用后续符号加载 进入VS---工具---选项----调试----符号,看右边有个“Microsoft符号服务器”,将前面的勾去掉,( ...

  3. std::function以及std::bind

    转自:https://blog.csdn.net/shuilan0066/article/details/82788954 示例1 : 普通函数 void gFunc() { cout << ...

  4. APP测试面试题(一)

    一.开场问题:(自由发挥) 1.请自我介绍一下: 2.为什么离开上一个公司呢? 3.做测试多久了?以前做过哪些项目?你们以前测试的流程是怎样的?用过哪些测试工具? 4.你觉得为什么要在一个团队中开展软 ...

  5. Jmeter与BlazeMeter使用 录制导出jmx

    本文链接:https://blog.csdn.net/weixin_38250126/article/details/82629876JMeter 的脚本录制,除了自带的HTTP代理服务器以外,被大家 ...

  6. Linux -- GCC Built-in functions for atomic memory access

    下列内建函数旨在兼容Intel Itanium Processor-specific Application Binary Interface, section 7.4. 因此,这些函数区别于普通的G ...

  7. JSONP实现Ajax跨域请求

    前言 由于浏览器存在同源策略的机制,所谓同源策略就是阻止从一个源(域名,包括同一个根域名下的不同二级域名)加载的文档或者脚本获取/或者设置另一个源加载的文档属性. 但比较特别的是:由于同源策略是浏览器 ...

  8. ubuntu 18.04安装mysql 8

    wget -c https://dev.mysql.com/get/mysql-apt-config_0.8.10-1_all.deb sudo dpkg -i mysql-apt-config_0. ...

  9. 定期删除IIS日志文件

    服务器中由于监控的需要会经常生成很多日志文件,比如IIS日志文件(C:\inetpub\logs\LogFiles),一个稍微有流量的网站,其日志每天可以达到上百兆,这些文件日积月累会严重的占用服务器 ...

  10. CentOS 7 vi常用命令

    用vi打开一个yum文件 vi /usr/bin/yum 按 i 键后  进入insert模式,进入insert模式后才能进行修改 修改完成后 按esc键进入command模式, 然后:wq 保存文件 ...