H5頁面載入後表單獲取焦點並喚起軟鍵盤?

得德發表於2018-12-29
需求:
在移動端網頁中,無論是表單頁面還是資訊釋出頁面,為了提供更好的使用者體驗,都希望開啟頁面時,獲取焦點彈出鍵盤。
實現?:
H5頁面並不能直接實現這項功能,由於安全策略,獲取焦點彈出鍵盤需要有使用者的主動互動行為,才能實現
以下,是網上的幾種方法,在實際測試中,並沒有完全實現效果,測試中發現,輸入框 input,textarea 以及input的不同type或有不同的情況出現,具體需求請具體測試​
1.通過js執行focus(),效果未出現。
2.增加autofocus屬性,效果未出現。
3.將程式碼放入延遲函式setTimeout 中執行,效果未出現。
4.利用trigge()方法,對要獲得焦點的input框,呼叫一次”click”事件,效果未出現。
5.通過使用者點選其它區域(body)點選來執行focus(),出現軟鍵盤。(效果出現,但還是增加了一步操作)
​​​
有條件協調H5容器的,可以嘗試下這種方法
  1. 要實現頁面載入完成後自動聚焦到 input 並彈出鍵盤,依賴 iOS App 的 WebView 將keyboardDisplayRequiresUserAction 設定為 NO,就可以支援。Android 底下只能依賴 JSBridge 呼叫 Android 原生方法喚起鍵盤 。
歡迎各路大神提供解決方案...


相關文章