H5页面加载后表单获取焦点并唤起软键盘?

需求:
在移动端网页中,无论是表单页面还是信息发布页面,为了提供更好的用户体验,都希望打开页面时,获取焦点弹出键盘。
实现?:
H5页面并不能直接实现这项功能,由于安全策略,获取焦点弹出键盘需要有用户的主动交互行为,才能实现 。

以下,是网上的几种方法,在实际测试中,并没有完全实现效果,测试中发现,输入框 input,textarea 以及input的不同type或有不同的情况出现,具体需求请具体测试​

1.通过js执行focus(),效果未出现。
2.增加autofocus属性,效果未出现。
3.将代码放入延迟函数setTimeout 中执行,效果未出现。
4.利用trigge()方法,对要获得焦点的input框,调用一次”click”事件,效果未出现。
5.通过用户点击其它区域(body)点击来执行focus(),出现软键盘。(效果出现,但还是增加了一步操作) .

​​
有条件协调H5容器的,可以尝试下这种方法

要实现页面加载完成后自动聚焦到 input 并弹出键盘,依赖 iOS App 的 WebView 将keyboardDisplayRequiresUserAction 设置为 NO,就可以支持。Android 底下只能依赖 JSBridge 调用 Android 原生方法唤起键盘 。

欢迎各路大神提供解决方案…

猜你喜欢

转载自blog.csdn.net/qq_41969216/article/details/86018502