這篇文章主要講解了“微信小程序中textarea與input的問題怎么解決”，文中的講解內(nèi)容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“微信小程序中textarea與input的問題怎么解決”吧！

創(chuàng)新互聯(lián)專注于灞橋網(wǎng)站建設服務及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供灞橋營銷型網(wǎng)站建設，灞橋網(wǎng)站制作、灞橋網(wǎng)頁設計、灞橋網(wǎng)站官網(wǎng)定制、小程序開發(fā)服務，打造灞橋網(wǎng)絡公司原創(chuàng)品牌,更為您提供灞橋網(wǎng)站排名全網(wǎng)營銷落地服務。

1、綁定bindkeyboardheightchange事件

問題：只為textarea綁定bindkeyboardheightchange事件，input也會觸發(fā)textarea的bindkeyboardheightchange事件，并且觸發(fā)所攜帶的參數(shù)都是textarea上面的參數(shù)

機型：安卓必現(xiàn)

解決辦法：未找到解決辦法

2、設置hold-keyboaed為true時

問題：當把textarea和input的hold-keyboaed屬性設置為true時，并且input中有一個type不為text時,連續(xù)切換會把鍵盤上方的完成卡住，并且不會再聚焦textarea

機型：安卓必現(xiàn)

解決辦法：1. 通過show-confirm-bar不顯示textarea鍵盤抬起時上方的完成按鈕，2. input的type都設置為text，3. 不設置hold-keyboaed為true

3、textarea穿透問題

問題：當有fixed元素時，無論設置多少z-index值，textarea組件都會穿透該fixed元素

機型：安卓偶現(xiàn)

玄學點：有時是不會出現(xiàn)的，但當我重新編譯、掃碼預覽時，就會出現(xiàn)textarea穿透問題，并且之后都會一直出現(xiàn)，但當我把小程序在手機上刪除后，重新編譯掃碼就有幾率不會出現(xiàn)該問題

解決辦法：當遇到需要fixed元素蓋住textarea時，可以當fixed元素出現(xiàn)時，將textarea隱藏或者變成view元素

4、綁定bindfocus事件

問題：當只給textarea綁定bindfocus事件，進入頁面先點擊textarea后，再馬上點擊input會觸發(fā)textarea的focus事件

機型：安卓偶現(xiàn)

解決辦法：可以通過focus去動態(tài)的控制textarea的聚焦情況，并且盡量不設置input的type為number類型

5、transition動畫

問題：在鍵盤抬起過程中如果通過bottom或translateY手動抬起page頁面時，并設置了transition動畫屬性，會導致textarea的placeholder閃動

機型：安卓必現(xiàn)

解決辦法： 判斷機型，ios添加transition屬性，安卓機器不添加transition屬性

6、點擊完成時

問題：textarea綁定bindkeyboardheightchange事件，并且使用了自帶的完成時，點擊完成時不會觸發(fā)bindkeyboardheightchange事件

機型：安卓偶現(xiàn)

解決辦法：未找到解決辦法

7、設置auto-height時

問題：當textarea的auto-height屬性為true時，會導致使用selectComponet獲取高度時出現(xiàn)問題，有時是沒有內(nèi)容的一排初始高度，有時是textarea的默認高度

機型：ios和安卓

解決辦法：動態(tài)控制auto-height的值，或使用定時器延遲獲取高度

8、鍵盤高度獲取不一致

問題：多次觸發(fā)bindkeyboardchange事件，從事件中獲取的keyboardHeight高度不一致，有時是帶了完成的高度，有時是沒有帶完成的高度

機型：安卓偶現(xiàn)

解決辦法：未找到解決辦法

9、獲取數(shù)據(jù)精度問題

問題：通過selectComponet獲取元素的高寬或位置時，會默認保留全部小數(shù)，大概為16位，有幾率導致動畫出現(xiàn)混亂

機型：ios和安卓偶現(xiàn)

解決辦法：js語言本身就有精度問題，所以在通過selectComponent獲取到數(shù)據(jù)后，最好只保留兩位小數(shù)來進行處

感謝各位的閱讀，以上就是“微信小程序中textarea與input的問題怎么解決”的內(nèi)容了，經(jīng)過本文的學習后，相信大家對微信小程序中textarea與input的問題怎么解決這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是創(chuàng)新互聯(lián)，小編將為大家推送更多相關知識點的文章，歡迎關注！