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 原生方法唤起键盘 。

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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值