/qq_38296051/article/details/109290225
/qq_42231156/article/details/103490964
/rachelch/p/12858938.html
**
1、 安卓键盘弹起会触发页面的resize 事件（ios不会），所以可以通过判断页面高度的前后变化来判断键盘的状态。
2、 ios 在键盘收起的时候input 会失去焦点（安卓不会），所以可以通过input 的focus 和 blur 事件来判断键盘的状态
**
<van-searchv-model="value"placeholder="搜索"@focus="searchFocus"@blur="searchBlur"/>...<app-tabbar v-show="showTabbar"></app-tabbar>
showTabbar: true,originHeight: '',
mounted() {this.originHeight = document.documentElement.clientHeight || document.body.clientHeight;window.addEventListener('resize',this.handleResize);this.onLoad();},
isIos() {var m = navigator.userAgent;var isIos = !!m.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);let result = isIos ? true : false;return result;}, searchFocus() {if (this.isIos()) {this.showTabbar = false;console.log(this.showTabbar,'ios---隐藏底部栏');}},searchBlur() {if (this.isIos()) {this.showTabbar = true;console.log(this.showTabbar,'ios---显示底部栏');}},handleResize() {var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;if (resizeHeight < this.originHeight) {//当软键盘弹起，在此处操作if (!this.isIos()) {this.showTabbar = false;console.log(this.showTabbar,'安卓---隐藏底部栏');}} else {//当软键盘收起，在此处操作if (!this.isIos()) {this.showTabbar = true;console.log(this.showTabbar,'安卓---显示底部栏');}}},
如果觉得《h5(移动端) 监听软键盘弹起 收起》对你有帮助，请点赞、收藏，并留下你的观点哦！
