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



相关推荐
梦魇泪5 天前
实践项目开发-hbmV4V20250407-跨平台开发框架深度解析与VSCode一站式开发实践
vscode·react.js·taro
郑叹20036 天前
taro中使用captcha
微信小程序·taro
ace_TiAmo15 天前
React8+taro开发微信小程序,实现lottie动画
微信小程序·小程序·react·taro
HyaCinth15 天前
Taro 数字滚动组件
javascript·react.js·taro
菜鸟una16 天前
【Taro3.x + Vue3】搭建微信小程序
前端·vue.js·typescript·taro
男子峰1 个月前
京东Taro小程序原生端接入操作
ios·小程序·taro
悬炫2 个月前
taro开发小程序,跟手动刷新说拜拜
taro
程序员Agions2 个月前
《Tarojs多端组件库修炼手册:从"端水大师"到"变形金刚"的奇幻之旅》
taro
前端南玖2 个月前
小程序如何实现跨页面通信
javascript·小程序·taro
书边事.4 个月前
Taro+Vue实现图片裁剪组件
javascript·vue.js·taro