方案1
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| <input class="ipt" @focus="focus" @blur='done' type="text" placeholder="请输入名字" v-model="addressDetail.userName">
methods: {
focus() {
document.body.scrollTop = 0;
},
done() {
document.body.scrollTop = document.body.scrollHeight;
},
}
// 获得焦点时让页面滚动0
// 失去焦点时让页面滚动当前页面高度
|
方案2
1
2
3
4
5
6
| setInterval(() => {
window.scrollTo(0, document.body.scrollTop + 1);
document.body.scrollTop >= 1
&& window.scrollTo(0, document.body.scrollTop - 1);
}, 300);
// 效果很好，但不推荐使用
|
方案3
1
2
3
4
5
6
| document.body.addEventListener('focusin', () => { // 软键盘弹起事件
console.log('键盘弹起');
});
document.body.addEventListener('focusout', () => { // 软键盘关闭事件
console.log('键盘收起');
});
|
html
<input type=”text” placeholder=”联系人的手机号/QQ/微信” v-model=”contact” class=”ipt” **@blur=’done’**/>
js
done() {
document.body.scrollTop = document.body.scrollHeight;
}
*这样在 失去焦点 的时候触发 done方法 页面滚动下 就好了
