键盘监听事件，根据屏幕高度

丶凡人

于 2021-12-15 18:53:29 发布

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript 前端 html5

本文链接：https://blog.csdn.net/Devil678/article/details/121959159

本文介绍了一个基于JavaScript实现的解决方案，通过监听窗口大小调整来判断手机键盘的弹起和收起，当屏幕高度减少时，捕获键盘弹出事件，反之则记录键盘收起。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

根据屏幕的高度进行判断键盘是否弹起

data{
     retrun{
     defaultPhoneHeight: "", //屏幕默认高度
     nowPhoneHeight: "", //屏幕现在的高度
     }
},
 mounted() {
	this.defaultPhoneHeight = window.innerHeight;
	window.onresize = () => {
		this.nowPhoneHeight = window.innerHeight;
	};
},
destroyed() {
	window.onresize = null;
},
watch: {
  nowPhoneHeight: function() {
	if (this.defaultPhoneHeight > this.nowPhoneHeight) {
		console.log('键盘弹出事件')
		
	} else {
		console.log('键盘收起事件')
	}
},