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. [python学习篇][书籍学习][python standrad library][内建函数]之[list,open,len,pow,range,

    Python 解释器内置了一些函数,它们总是可用的.这里将它们按字母表顺序列出.     Built-in Functions     abs() divmod() input() open() st ...

  2. 【整理】python中re的match、search、findall、finditer区别

    match 从首字母开始开始匹配,string如果包含pattern子串,则匹配成功,返回Match对象,失败则返回None,若要完全匹配,pattern要以$结尾. search 若string中包 ...

  3. [错误处理]python大小写敏感,关键字不要写错

    今天调试程序,发现了一个极为隐蔽的bug. True False关键字大小写写错了,然后半天没找出问题所在.

  4. 【Luogu】P3047附近的牛(树形DP)

    题目链接 树形DP,设f[i][j]是当前在i点,j步之内有多少牛.从相邻点to的f[to][j-1]转移而来,减去重复计算即可. #include<cstdio> #include< ...

  5. Codeforces 898E Squares and not squares

    题目大意 给定 $n$($n$ 是偶数,$2\le n\le 2\times 10^{5}$)个非负整数 $a_1,\dots, a_n$($a_i\le 10^9$). 要求将其中 $n/2$ 个数 ...

  6. Miracast HDCP 等知识

    Miracast 通讯架构中关于视频数据处理流程的部分.整个视频数据处理及传输的流程,大致上分为几个阶段,一开始将撷取到系统的画面及声音进行压缩,而压缩后的影音数据再转为基本封包串流(Packetiz ...

  7. iOS-ARC机制

    内存管理是开发软件中重要的一个课题.如果内存管理不当,轻者内存泄露,重者程序崩溃. 下面重要讲述一下iOS的ARC(Automatic Reference Counting))机制. ARC的历史由来 ...

  8. showModalDialog实现本页面内部跳转

    showModalDialog的弹窗中,要实现本窗口跳转而不打开新窗口,要么submit提交,要么按如下跳转,而不能采用location=xx来跳转:function go_link(url) {   ...

  9. python中的 __xxx__ 方法

    1 __class__ instance.__class__ The class to which a class instance belongs def foo(): pass class A(o ...

  10. hibernate 4.3 在使用获取数据获取不到数据库中最新变更的数据问题解决

    hibernate 4.3 在使用获取数据获取不到数据库中最新变更的数据问题解决,应该是因为缓存问题 问题过程和现象: 查询一个数据列表=>数据库中手动update了数据=>刷新页面,数据 ...