微信小程序中input和picker之间切换导致input无法失去焦点

picker组件与input组件在一起使用时，若input组件获取焦点，点击picker组件时input组件不会失去焦点，导致的input组件弹出的键盘把picker组件遮挡了。

导致这个问题的原因可能是因为pick组件中嵌套了一个disable的input组件。

<input placeholder="测试"></input>
<picker mode='region' bindchange="onRegionChange"><input disabled  placeholder="请选择"></input> <!-- 这里使用了input作为picker的展示组件 -->
</picker>

这里提供几个解决办法：

1.给 picker组件绑定点击事件并且input一定要是disable，点击后调用 wx.hideKeyboard() 隐藏掉键盘。

2.使用view组件模拟picker组件的展示组件。

3.给input组件绑定focus变量，点击picker组件后设置focus的变量为false。

微信小程序中input和picker之间切换导致input无法失去焦点相关推荐

微信小程序中顶部导航栏全局切换
一.场景微信小程序和企业微信小程序共用一个,从不同入口进入小程序显示不同的顶部导航栏二.思路 1.app.json中全局设置只能写死一个,无法实现 2.app.js中直接使用wx.setNavig ...
ios微信小程序中 input 输入框问题，输入的光标中的内容自动清空
ios微信小程序中 input 输入框问题,输入的光标中的内容自动清空问题描述 1.我在页面上有个倒计时的功能,每一秒都在更新时间,更新时间显示的值(view一直变) 2.我调用input输入框,准 ...
手把手教你开发微信小程序中的插件
继上次手把手教你实现微信小程序中的自定义组件已经有一段时间了(不了解的小伙伴建议去看看,因为插件很多内容跟组件相似),今年3月13日,小程序新增了小程序**「插件」功能,以及开发者工具新增「 ...
在微信小程序中怎么让一个页面的信息传递到另一个页面
首先需要在前台搭建好需要展示的那个页面.  <view class='nav'>输入个人信息</view> ...
关于微信小程序中时间预约的简单实现
关于微信小程序中时间预约的简单实现 1. js中定义获取日期函数.日期点击事件 2. 在data中定义数组等变量 3. onLoad调用函数并保存回data 4. wxml展示 5. 页面监控函数on ...
【微信小程序】选择器组件picker
文章目录 [微信小程序]选择器组件picker picker组件的定义 picker组件的类型 picker属性共同的属性时间选择器time 参考 [微信小程序]选择器组件picker picke ...
html img 手势缩放,微信小程序中利用image组件实现图片手势缩放
微信小程序中利用image组件实现图片手势缩放,前端大神严灏的牛文,讲解了微信小程序中image组件的三种是缩放模式,三种之中,只有 aspectFit 模式可以等比例缩放图片,并显示完整的图片. 原 ...
如何在微信小程序中使用ECharts图表
在微信小程序中使用ECharts 1. 下载插件首先,下载 GitHub 上的 ecomfe/echarts-for-weixin 项目. 下载链接:ecomfe/echarts-for-weixi ...
微信小程序中尺寸单位rpx及样式的用法
rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应.规定屏幕宽为750rpx.如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375p ...

微信小程序中input和picker之间切换导致input无法失去焦点

微信小程序中input和picker之间切换导致input无法失去焦点相关推荐

最新文章

热门文章