1.问题一:当某输入框获取焦点时弹起自定义时间插件,貌似很简单一个功能但测试时问题来了,获取焦点时键盘也会跟着一起弹出来如下图:
,那么到这里你可能會有种给input标签增加 readonly 属性的想法那么我们来试试效果如何,提供ios和Android的两个截图:
恩Android看着没什么问题了,那我们来看看iOS
看着好像也没什么問题但是仔细看屏幕下方,用户还是可以操作键盘what?我只是想隐藏个键盘啊,so bad静下新来仔细想想此过程发生了什么,当我们点击input的时候触发focus事件,键盘怎么移动到原来位置端focus事件会触发键盘弹起那么,在focus事件触发时我们可不可以手动让它触发blur事件呢答案肯定是可鉯的,那么我们来试试:
2.问题二:填写订单页面有很多的input框供用户输入信息当键盘弹起时,底部"提交订单"一栏使用的是fixed定位会被键盘頂起,如下图:
这里的解决方案是当focus被触发时键盘会弹出这时候页面就会发生scroll滚动,我们只需监听resize的变化然后对应的变化时将底部隐藏,无变化时再显示代码如下: