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



相关推荐
weixin_4713830313 天前
Taro-02-页面路由
前端·taro
weixin_4713830313 天前
Taro-03-页面生命周期
前端·javascript·taro
weixin_4713830313 天前
Taro-05-分包策略
taro
weixin_4713830313 天前
Taro-04-网络请求
前端·javascript·taro
Geek_Vison14 天前
2026 跨端框架横评:FinClip、Taro、uni-app、Remax、mPaaS 五款工具技术+业务双维度测评
小程序·uni-app·taro·mpaas·小程序容器
喵个咪23 天前
基于 Taro 的 Headless CMS 多端前端架构:技术解析与二次开发导引
前端·react.js·taro
Dragon Wu2 个月前
Taro v4.2.0 scss使用“@/xxx“的配置方法
前端·小程序·taro·scss
朱良2 个月前
Taro小程序生成分享海报解决方案
taro
代码不加糖2 个月前
从零手写简易 Taro:20 行 JSX 如何变成小程序?(硬核实战)
小程序·taro
lichenyang4532 个月前
从零到一:用 Taro + React 搭建数据采集小程序
react.js·小程序·taro