taro h5 ios解决input不能自动获取焦点拉起键盘

描述:页面中有个按钮,点击跳转到第二个页面(有input),能直接获取焦点拉起键盘输入

安卓:

直接用focus()

ios:

focus无效,必须手动拉起

原理:

点击按钮的时候拉起一个此页面隐藏的input或者全局隐藏的input拉起键盘, 跳转后通过setSelectionRange 去设置光标

步骤一:定一个全局的隐藏input,并挂到window上
步骤二:第一个页面点击按钮,调起全局input, 然后跳转
步骤三:在第二个页面去设置页面中的input光标


这里的坑:

1)querySelector 是获取的页面第一个指定dom

  1. 必须用settimeout, 否则键盘能拉起,但是光标不在input中,不能直接输入

3)这里的input是原生的,可以直接获取到,如果用第三方ui, 比如taroui中的 AtSearchBar ,必须用最里面的input, 不能用AtSearchBar 上其他的dom, 并且要放到settimeout中, 否则为null



相关推荐
京东零售技术2 天前
Taro小程序开发性能优化实践
性能优化·taro
少恭写代码7 天前
duxapp 2024-12-18更新 新增 Svg 组件 Tab 支持幻灯片切换功能
react native·小程序·taro
苍岚丨晨苏8 天前
使用Taro开发iOS App触发额外权限请求的问题
react native·taro
sir.山19 天前
taro小程序进入腾讯验证码
小程序·taro·验证码·腾讯验证码·uniapp验证码·原生验证码
是陈哈哈噢22 天前
Taro小程序开发随记
前端·微信小程序·taro
他的猫哎23 天前
taro+vue3 + nut-popup微信小程序真机不显示问题
ios·微信小程序·vue·taro
他的猫哎23 天前
taro小程序马甲包插件
小程序·notepad++·taro
@ 前端小白24 天前
taro使用createAsyncThunk报错ReferenceError: AbortController is not defined
reactjs·taro
那就可爱多一点点1 个月前
在 Taro 中实现系统主题适配:亮/暗模式
taro
Dragon Wu1 个月前
Taro React小程序开发框架 总结
前端·react.js·前端框架·taro