input框在ios和android的適配問題


問題1:input框獲取焦點彈出鍵盤后iOS無法輸入文字

  解決:css中加上   -webkit-user-select:text !important;

  

問題2: 獲取焦點時的光標IOS顏色和輸入文字顏色不一致

  解決:手動設置顏色:caret-color: #952BF7;

  

問題3: input框獲取焦點時,IOS手機頁面被鍵盤抬起,鍵盤落下后,頁面未回彈

  解決:在input框失去焦點時,調用window.scrollTo方法手動將頁面滾回原來的位置,這里以vue項目為例

  

問題4: 當底部有吸底條,即絕對定位的按鈕時,input框獲取焦點鍵盤被抬起的同時android會將吸底條抬到鍵盤之上,用戶體驗不好,這里以vue為例(參考別人的文章最后解決了,記不清是哪位大佬的,感謝)

  解決:用一個變量控制吸底條的顯示隱藏,在頁面打開時設置實時屏幕高度。 動態監聽頁面高度隱藏,原理時在鍵盤抬起時隱藏吸底條,鍵盤落下時恢復吸底條,以達到目的

  

  在data中獲取高度

  

 

  

  動態監聽頁面高度變化

  

 

  

 

 

 

  

 

 

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM