解决Vue 移动端在iOS中点击输入框无法聚焦问题
在移动端开发过程中,都是通过控制台去改变屏幕大小调试页面,基本上不会去考虑唤起键盘的问题,在ios端唤起键盘会有一定时间的延迟,点击输入框不能聚焦,或者点击多次才能聚焦的问题,解决方法如下
引入 npm fastclick 插件
打开cmd cd到项目里.
npm install fastclick -S
在main.js中全局引入
// 引入 fastclick 并重写其 focus 方法
import FastClick from 'fastclick'
// 修复点击延迟
if ('addEventListener' in document) {
document.addEventListener('DOMContentLoaded', () => {
FastClick.attach(document.body)
}, false)
}
FastClick.prototype.focus = function(targetElement) {
targetElement.focus();
};
const ver=navigator.userAgent.match(/cpu iphone os (.*?) like mac os/);
if(!ver){//非IOS系统
// 引入fastclick 做相关处理
FastClick.attach(document.body);
}
else {
if(parseInt(ver[1])< 11){
// 引入fastclick 做相关处理
FastClick.attach(document.body);
}
}
问题就完美解决了 扩展
Load 和 DOMContentLoaded 区别
Load 事件触发代表页面中的 DOM,CSS,JS,图片已经全部加载完毕。
DOMContentLoaded 事件触发代表初始的 HTML 被完全加载和解析,不需要等待 CSS,JS,图片加载。
版权声明:本文为weixin_44343557原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。