<input type="text" class="password-input" name="getCode" value="{{code}}" placeholder="請(qǐng)輸入測(cè)試碼" placeholder-class="phcolor" bindinput="editCode" focus="focus" bindfocus="listenFocus" bindblur="listenBlur"></input>
<text class="start-btn" bindtap="submitTestCode">確定</text>
<text class="cancel-btn" bindtap="changeShowTestCodePop">取消</text>
如上圖所示,在小程序彈窗內(nèi)第一行有Input和2個(gè)按鈕。
異常是在真機(jī)上點(diǎn)擊取消按鈕隱藏彈窗時(shí),input會(huì)異常聚焦,頁面顯示異常,會(huì)顯示為Input框內(nèi)值,并自動(dòng)拉起小鍵盤。在真機(jī)點(diǎn)擊小鍵盤任意鍵或者隱藏小鍵盤可消除殘影。
?嘗試當(dāng)?shù)胗浫∠粹o時(shí),設(shè)置input的focus為false,并監(jiān)聽input的聚焦和失焦事件,真機(jī)異常仍然存在。
changeShowTestCodePop: function () {
var that = this;
var showTestCodePop = that.data.showTestCodePop;
that.setData({
showTestCodePop: !showTestCodePop,
focus: false
})
},
listenFocus: function () {
console.log("我聚焦了~~");
},
listenBlur: function () {
console.log("我失焦了~~");
},
?嘗試把取消按鈕事件綁定在購買文本上,真機(jī)無異常,懷疑是離Input太近了影響的。設(shè)置了input和取消按鈕的相對(duì)定位,并且取消按鈕層級(jí)更高。異常還在。文章來源:http://www.zghlxwxcb.cn/news/detail-726318.html
<input type="text" class="password-input" name="getCode" value="{{code}}" placeholder="請(qǐng)輸入測(cè)試碼" placeholder-class="phcolor" bindinput="editCode"></input>
<button class="start-btn" bindtap="submitTestCode">確定</button>
<button class="cancel-btn" bindtap="changeShowTestCodePop">取消</button>
最后把文本按鈕的<text></text>標(biāo)簽改成了<button></button>,異常消失,問題解決。原理還不清楚,有懂的大佬路過麻煩講解下,感謝~文章來源地址http://www.zghlxwxcb.cn/news/detail-726318.html
到了這里,關(guān)于微信小程序input異常聚焦的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!