https://blog.csdn.net/qq_38296051/article/details/109290225
https://blog.csdn.net/qq_42231156/article/details/103490964
https://www.cnblogs.com/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(移动端) 监听软键盘弹起、收起的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。