uniapp中input聚焦禁止軟鍵盤彈出方法
更新時間：2023年01月06日 10:15:45 作者：普通網(wǎng)友
在使用uni-app完成掃碼功能時,有時需要聚焦文本框的同時,需要軟鍵盤消失,下面這篇文章主要給大家介紹了關于uniapp中input聚焦禁止軟鍵盤彈出的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
需求：在進入頁面時需要input聚焦，但是不彈出軟鍵盤
方法一：使用uniapp自帶方法uni.hideKeyboard()來隱藏軟鍵盤
方法二：使用readonly屬性規(guī)定輸入字段為只讀
方法三：使用document.activeElement.blur()移開焦點
方法四：通過div模擬input來實現(xiàn)
以上方法網(wǎng)上都有，但是都沒有解決我的需求，下面是我使用的方法
方法五：通過定時器來實現(xiàn)隱藏鍵盤
一般項目通常使用方法一就可以解決，或者日期類型也可以通過以上方法來實現(xiàn)。
我們項目有物理按鍵，不需要軟鍵盤，以上方法會導致進入頁面input聚焦時鍵盤會閃一下，體驗不好，所以使用了定時器，定時觸發(fā)隱藏鍵盤來解決
在onLoad中調(diào)用方法stop
onLoad(){
let _self = this;
_self.stop()
}
methods
stop(){
var interval = setInterval(function(){
uni.hideKeyboard();//隱藏軟鍵盤
console.log('刷新')
},20);
setTimeout(() => {
clearInterval(interval);
console.log('停止刷新')
},3000);
},
通過定時來刷新，完美解決
總結
到此這篇關于uniapp中input聚焦禁止軟鍵盤彈出的文章就介紹到這了,更多相關uniapp input聚焦禁止軟鍵盤彈出內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
uni-app是一個使用Vue.js開發(fā)所有前端應用的框架,開發(fā)者編寫一套代碼,可發(fā)布到iOS，Android,H5,以及各種小程序（微信/支付寶/百度/頭條/?QQ?/釘釘）等多個平臺,這篇文章主要給大家介紹了關于使用uni-app打包H5的相關資料,需要的朋友可以參考下2022-11-11
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)拖拽功能,代碼簡單易懂，非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2019-09-09
這篇文章主要介紹了小程序設置緩存并且不覆蓋原有數(shù)據(jù)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-04-04
ionic2自定義cordova插件開發(fā)以及使用（Android）
這篇文章主要為大家詳細介紹了ionic2自定義cordova插件開發(fā)以及使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-06-06
讓html元素隨瀏覽器的大小自適應垂直居中的實現(xiàn)方法
下面小編就為大家?guī)硪黄宧tml元素隨瀏覽器的大小自適應垂直居中的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-10
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)默認第一個選中變色效果，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2018-07-07
這篇文章主要介紹Javascript實現(xiàn)二級下拉菜單的具體過程,需要的朋友可以參考下2014-06-06
這篇文章主要給大家介紹了關于JavaScript惰性求值的一種實現(xiàn)方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-01-01
鼠標事件的移動及移出效果都可以使用js來自定義，下面有個示例，實，效果為當事件發(fā)生改變時背景顏色也隨著改變2014-10-10
這篇文章主要為大家詳細介紹了微信小程序自定義帶價格顯示日歷效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-12-12