ios html5键盘弹出视图上移,ios 软键盘弹出, 页面整体上移问题
一、问题描述对于 ios 系统,输入框输入内容,软键盘弹出,页面内容整体上移,但是软键盘收起,页面内容不会自动回到原本的位置,必须手动下拉才会恢复刚开始遇到的时候,心想真是什么鬼畜问题都有,这边直接给出解决办法了二、解决方式首先在你们函数工具文件中加上下面的函数// util.jsfunction inputBlur () {let u = navigator.userAgentlet isIOS
一、问题描述
对于 ios 系统,输入框输入内容,软键盘弹出,页面内容整体上移,但是软键盘收起,页面内容不会自动回到原本的位置,必须手动下拉才会恢复
刚开始遇到的时候,心想真是什么鬼畜问题都有,这边直接给出解决办法了
二、解决方式
首先在你们函数工具文件中加上下面的函数
// util.js
function inputBlur () {
let u = navigator.userAgent
let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
if (isIOS) {
setTimeout(() => {
const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0
window.scrollTo(0, Math.max(scrollHeight - 1, 0))
}, 200)
}
}
在具体的文件中使用方式如下:
v-model="inputValue"
placeholder="请输入"
type="text"
@blur.prevent="checkValue"
>
checkValue() 函数
checkValue () {
inputBlur()
this.$emit('checkValue')
},
至此, 关于 ios 软键盘整出的鸡肋问题就解决啦
更多推荐
所有评论(0)