移动端input输入框把页面顶起, 收起键盘页面复原不了问题
我相信大家平时也会遇到这种问题, 移动端 input 或者 textarea获取光标, 整个页面被顶起来, 键盘收起, 页面不复原的问题
====>>>> 
我这边提供两种解决方案:
1. 针对 vue.js
html:
<input v-model="workWhere" @blur="changBlur"> js:
methods: {
changBlur(){
window.scroll(0,0);//失焦后强制让页面归位
},
}
2.针对原生 或者 JQ
<div class="box">
<input placeholder="请选择">
</div> $(".box input").on("blur",function(){
window.scroll(0,0);//失焦后强制让页面归位
});
移动端input输入框把页面顶起, 收起键盘页面复原不了问题的更多相关文章
- 移动端input“输入框”常见问题及解决方法
转自 https://www.cnblogs.com/ljx20180807/p/9837748.html 1. ios中,输入框获得焦点时,页面输入框被遮盖,定位的元素位置错乱: 当页input存在 ...
- 点击底部input输入框,弹出的软键盘挡住input(苹果手机使用第三方输入法 )
测试移动端页面的时候,偶然发现点击底部input输入框时,弹出的虚拟键盘偶尔会挡住input输入框. 输入框固定在页面底部,如图所示: input固定底部设计图.png 点击底部input输入框唤 ...
- IOS系统input输入框为readonly时, 隐藏键盘上的上下箭头
业务中在一定场景中会将input 设置为只读状态,在IOS safari上当input 输入框focus 时,仍会出现键盘上的上下箭头,这种用户体验非常不好,如何干掉呢? <input read ...
- 移动端页面中点击input输入框的时候弹出的键盘将输入框挡住的问题
使用的是vux框架, 以为是框架问题, 后来发现是把当前页面的高度写死为了height:200%: 只要把高度去掉就能让页面自动弹到输入框的上方:
- 移动端 input 输入框实现自带键盘“搜索“功能并修改X
主要利用html5的,input[type=search]属性来实现,此时input和type=text外观和功能没啥区别: html代码入下: <form action="" ...
- input输入框直接拉起九宫格数字键盘
<input type="number" pattern="\d*">
- iOS中 H5的input输入框focus()无法自动拉起键盘(解决方法)
ios的hybird APP 无法使用focus()获取焦点和键盘的问题. 解决方案 原来,在App的配置文件(config.xml),里面默认会有一句 1 <preference name=& ...
- React Native登录注册页面实现空白处收起键盘
其实很简单,直接使用ScrollView作为父视图即可.有木有很神奇啊,以前都还不知道呢.....
- 苹果系统 IOS 12 的H5 BUG :键盘把页面顶上去了,底下留有一块空白区域
苹果以往的系统是没问题的,一般情况下,点击input唤起键盘后是会自动显示到输入框的地方,然后收起键盘页面就会恢复到底部. 但是如果苹果是已经更新到最新的IOS12的话就会发生一个BUG ,就是键盘唤 ...
随机推荐
- 原生JS实现拼图游戏
最近无聊,练练原生JS:实现拼图游戏.两种玩法:第一种是单击元素进行交换位置:第二种是拖拽元素进行位置交换.首先需要上传图片并进行回显(需要用到FileReader):下面是部分截图: 可以自行设置切 ...
- Java基础:ThreadLocal及其原理
ThreadLocal的用处 ThreadLocal是一个多线程的辅助工具类,目的是方便开发者维护多线程中的共享变量.我们知道如果我们想要在一个线程中一直访问一个变量或者在线程上下文中保存一个变量,我 ...
- LGP5204题解
@CF1327F 最小值看着有点怪,先转化成最大值吧...反正没啥区别... 考虑把最大值相同的区间和限制为这个最大值的区间都拿出来.然后离散化.问题变为让所有区间都满足最值为 \(c\). 考虑 D ...
- matlab语法基础(处理一点数据)
1.声明函数,返回参数data,函数名为simutrack function data=simutrack(x0,y0) 2.%用于标注,注释 3.平方 ^2 4.二维零矩阵 [0 0;0 0] 5. ...
- Golang 基础之基础语法梳理 (一)
大家好,今天将梳理出的 Go语言基础语法内容,分享给大家. 请多多指教,谢谢. 本次<Go语言基础语法内容>共分为三个章节,本文为第一章节 Golang 基础之基础语法梳理 (一) Gol ...
- SIMOTION D435-2 PN报错1915,无法进入RUN状态 解决方法
1.现象 2.解决方法 以下几种情况会导致SIMOTION D CPU无法RUN状态: 1.SIMOTION D设置CPU上电后自动进入RUN状态,上电后D4x5 CPU准备就绪,开始执行系统任务区的 ...
- Python通过snap7库与西门子S7-1200建立S7通信,读写存储器数据,顺便写个流水灯
1.snap7 简介 snap7 是一个基于以太网与S7系列的西门子PLC通讯的开源库. 支持包括S7系列的S7-200.S7-200 Smart.S7-300.S7-400.S7-1200以及S7- ...
- 题解0005:数的划分(洛谷P1025)
题目描述:将整数 n 分成 k 份,每份不能为空,颠倒顺序的被看成一种分法. 题目链接:https://www.luogu.com.cn/problem/P1025 题目思路:深搜剪枝,规定搜索的下一 ...
- Xshell 连接虚拟机OS Linux 设置静态ip ,网络配置中无VmWare8 的解决办法
前序:最近开始研究Hadoop平台的搭建,故在本机上安装了VMware workstation pro,并创建了Linux虚拟机(centos系统),为了方便本机和虚拟机间的切换,准备使用Xshell ...
- 序列化接口的id有什么用?
反序列化Java对象时必须提供该对象的class文件,现在的问题是随着项目的升级,系统的class文件也会升级,Java如何保证两个class文件的兼容性? Java序列化机制允许为序列化类提供一个p ...