https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollIntoView

移动端input被键盘遮挡，事件是跳到可视区域！

document.querySelector('#inputId').scrollIntoView();

//只要在input的点击事件，或者获取焦点的事件

还有一个事件是指定在上方或下方

https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollIntoViewIfNeeded

移动端底部input被弹出的键盘遮挡的更多相关文章

  1. ios下input focus弹出软键盘造成fixed元素位置移位

    正常状态下 input focus软键盘弹出时 问题描述: 头部结构fixed,滚动到下部内容区域,input.textarea等focus弹出软键盘时,头部位置偏移被居中(该问题ios7 beta3 ...

  2. 移动端 输入框 input 被弹出来的键盘 挡住

    给被挡住的input或者textarea加一个id,然后在click事件里调用下面的代码 document.querySelector('#xxx').scrollIntoView();

  3. 禁止移动端input弹出软键盘

    在做三级联动,或者一些时间插件的时候总是弹出软键盘,用下面的方法就可以禁用掉,废话不多说直接上代码. HTML代码 <div class=""> <div> ...

  4. 解决IOS safari在input focus弹出输入法时不支持position fixed的问题

    该文章为转载 我们在做移动web应用的时候,常常习惯于使用position:fixed把一个input框作为提问或者搜索框固定在页面底部.但在IOS的safari和webview中,对position ...

  5. 移动端和PC端页面常用的弹出层

    我们在页面的时候,很多时候用到了弹出层,消息提醒,确认框等等,统一样式的弹出框可以使页面更加优美.在此,我整理一下我们项目的移动端和PC端页面常用的弹出层. 一.移动端 我们需在页面引入弹出框的样式和 ...

  6. 点击input触发弹出框的bug

    先点击第一个input建立弹出框,再点击第二个input打开弹出框,操作点击,同时触发了两个input点击事件.主要原因是建立弹出框时绑定了input1的click事件,再次触发时,又再亿次绑定了in ...

  7. 手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法

    手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法 最近碰到Android微信内置浏览H5页面,因为其中的文本输入框(input)放置在靠近页面的中下方,点击文本框以后,则输入框会被弹出的手机 ...

  8. js输入密文弹出数字键盘

    我们经常被产品要求,在移动端的web页面上的输入框输入密码时要弹出数字键盘,而不是全键盘,这个该怎么实现呢? 1.首先要弹出数字键盘,我们只能把input框的type从password改为tel 2. ...

  9. mui+回复弹出软键盘

    最近再做一个APP的时候,有一个评论回复的功能,在做APP的时候,直接用手指触发focus事件,来唤醒软键盘的弹出没有问题, 但是现在的功能需要对点击回复进行弹出软键盘来操作,参考过很多都有问题,后来 ...

随机推荐

  1. poj2135最小费用最大流经典模板题

    Farm Tour Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 13509   Accepted: 5125 Descri ...

  2. kb-07线段树--11--区间多重该值多种查询

    /* lazy思想的运用,因为查询多种,如果全记录就太繁了,lazy就是如果该区间的每一个叶子的状态都相同就不用深入下去该值,只要暂时标记下,查询的时候也不用下去,直接计算: */ #include& ...

  3. hihoCoder #1157 建造金字塔

    这道题我想了一天才想清楚做法.AC 了之后去看别人写的题解,都是三言两语意识流式描述,我并不能读懂.我觉得很自卑,为何人家解这道题如此轻松.不过,我还是决定把我的解法写下来,并且一定要写清楚. 思路 ...

  4. 单例/单体模式(Singleton)

    单例/单体模式(Singleton) 首先,单例模式是对象的创建模式之一,此外还包括工厂模式. 单例模式的三个特点: 1,该类只有一个实例 2,该类自行创建该实例(在该类内部创建自身的实例对象) 3, ...

  5. java面试题之什么是线程ThreadLocal？作用是什么?

    定义:线程局部变量是局限于线程内的变量,属于线程自身所有,不在多个线程间共享.java提供ThreadLocal类来支持线程局部变量,是一个实现线程安全的方式. 任何线程局部变量一旦在工作完成后没有释 ...

  6. 反射+注解：excel2module

    package test.excelTest; import java.io.File; import java.io.FileInputStream; import java.lang.reflec ...

  7. jenkins下添加HTML Publisher Plugin及配置

    1.点击“系统设置”->“插件管理”,点击可选插件,搜索插件,如下: 2.点击直接安装,等待安装完成,如下: 3.在配置job中,在构建后操作,选择安装的HTML Publisher plugi ...

  8. FZOJ 2102 Solve equation

                                                                                                        ...

  9. SharePoint 2013 App 开发—App开发概述

    基于安全性的考虑,SharePoint App 不能像其它两种方式一样,直接使用安全性更高的服务端代码的API.Javascript 扮演极为重要的角色,在SharePoint App中与ShareP ...

  10. 【CF1028B】Unnatural Conditions（构造）

    题意:给定n与m,要求构造两个长度不超过2230的数字x,y使得x,y各自的数位和>=n,x+y的数位和<=n 思路: #include<cstdio> #include< ...