在开发微信小程序的时候遇到，输入用户名或者手机号以及地址，手机键盘调起来，会把输入框遮挡。

如图：

以上两张图是自己工作中遇到的，此处不要着急，一个属性帮你搞定。

cursor-spacing：指定光标与键盘的距离，单位px或rpx，默认为px。取 input 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离

微信小程序开发文档api:

https://developers.weixin.qq.com/miniprogram/dev/component/input.html

https://developers.weixin.qq.com/miniprogram/dev/component/textarea.html

最终呢，就解决输入框被遮挡问题喽！

源：

https://my.oschina.net/hp2017/blog/1819169?from=singlemessage&isappinstalled=0

微信小程序 - 弹出键盘遮挡住输入框的更多相关文章

  1. 微信小程序弹出操作菜单

    微信小程序弹出操作菜单 比如在页面上放一个按钮,点击按钮弹出操作菜单,那么在按钮的 bindtap 事件里,执行下面的代码即可: wx.showActionSheet({ itemList: ['A' ...

  2. 微信小程序弹出层点击穿透问题

    问题描述:使用小程序的modal组件实现遮罩层效果时,会出现滚动穿透的问题,即遮罩层后面的页面依旧可以滚动. 解决方案: 给底层页面动态添加 position:fixed; 代码: wxml: < ...

  3. 使用movable-view制作可拖拽的微信小程序弹出层效果。

    仿了潮汐睡眠小程序的代码.[如果有侵权联系删除 最近做的项目有个弹出层效果,类似音乐播放器那种.按照普通的做了一般感觉交互不是很优雅,设计妹子把潮汐睡眠的弹层给我看了看,感觉做的挺好,于是乘着有空仿照 ...

  4. 微信小程序弹出可填写框两种方法

    方法一: html页面: < view class = "container" class = "zn-uploadimg" > < butt ...

  5. 微信小程序弹出层

    1.消息提示     wx.showToast wx.showToast({ title: '成功', icon: 'success', duration: 2000 })2.模态弹窗 wx.show ...

  6. 微信小程序弹出层动画特效

    .rules_modal_cont{ height:800rpx; width:200rpx; -webkit-animation: showZeroAlert .3s; animation: sho ...

  7. 微信小程序弹出和隐藏遮罩层动画以及五星评分

    参考源码: http://www.see-source.com/weixinwidget/detail.html?wid=82 https://blog.csdn.net/pcaxb/article/ ...

  8. 微信小程序 - 弹出层组件

    需要的可以下载示例:maskalert

  9. 微信小程序弹出框滚动穿透问题

    1.在你的遮罩层最外层加 catchtouchmove="noneEnoughPeople" 里面是你的方法名2.noneEnoughPeople: function () { c ...

随机推荐

  1. hadoop完全分布式手动安装（一主多从centos linux各版本均试验成功，文档完整无一遗漏）

    hadoop完全分布式手动安装(一主多从centos linux各版本均试验成功,文档完整无一遗漏) 网上的文章99%都是垃圾,我凭良心书写,确保幼儿园同学也能安装成功! 查看系统环境    1.查看 ...

  2. Java 8学习之Stream API

    一个Stream表面上看与一个集合很类似,允许你改变和获取数据.但是实际上他与集合是有很大区别的: Stream自己不会存储元素.元素可能被存储在底层的集合中,或者根据需要产生出来. Stream操作 ...

  3. 由UI刷新谈到线程安全和Android单线程模型

    1.为什么说invalidate()不能直接在线程中调用? Android提供了Invalidate方法实现界面刷新,但是Invalidate不能直接在非UI主线程中调用,因为他是违背了单线程模型:A ...

  4. 侵入式单链表的简单实现(cont)

    前一节介绍的侵入式链表实现在封装性方面做得不好,因为会让消费者foo.c直接使用宏container_of().这一节对list的定义做了一点改进,如下所示: typedef struct list_ ...

  5. HighCharts理解与总结

    摘自:http://www.highcharts.com/docs/getting-started/installation Installation Highcharts requires two ...

  6. 入门系列之使用fail2ban防御SSH服务器的暴力破解攻击

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由SQL GM发表于云+社区专栏 介绍 对于SSH服务的常见的攻击就是暴力破解攻击--远程攻击者通过不同的密码来无限次地进行登录尝试.当 ...

  7. 【转】检测到在集成的托管管道模式下不适用的ASP.NET设置的解决方法（非简单设置为【经典】模式）。

    检测到在集成的托管管道模式下不适用的ASP.NET设置的解决方法(非简单设置为[经典]模式). 我们将ASP.NET程序从IIS6移植到IIS7,可能运行提示以下错误: HTTP 错误 500.23 ...

  8. Tomcat源码分析——请求原理分析（上）

    前言 谈起Tomcat的诞生,最早可以追溯到1995年.近20年来,Tomcat始终是使用最广泛的Web服务器,由于其使用Java语言开发,所以广为Java程序员所熟悉.很多人早期的J2EE项目,由程 ...

  9. DateTime compare

    DateTime t1 = new DateTime(100); DateTime t2 = new DateTime(20); if (DateTime.Compare(t1, t2) > 0 ...

  10. js 列表选择

    首选定义数组,然后进行操作时遍历数组获取选中值 function getSelect(userId) { //var userId = userCheckBox.value; //标记删除还是添加 v ...