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. 谋哥:搞APP，做得累的都不对!

    最近谋哥(微信viyi88)我刚加入“秦王会”,思想收到猛烈地冲击,各位大佬的思维有时候会让我大脑短路,收获不少.同时,我也慢慢发现我一直平静的 心开始浮躁,我发现苗头不对,于是开始静下心来.静下心, ...

  2. 创建sql作业（JOB）

    在SQL Server日常需求处理中,会遇到定时执行或统计数据的需求,这时我们可以通过作业(JOB)来处理,从而通过代理的方式来实现数据的自动处理.一下为SQL Server中创建作业的脚本,供大家参 ...

  3. Leetcode 421.数组中两数的最大异或值

    数组中两数的最大异或值 给定一个非空数组,数组中元素为 a0, a1, a2, … , an-1,其中 0 ≤ ai < 231 . 找到 ai 和aj 最大的异或 (XOR) 运算结果,其中0 ...

  4. ICPC南京补题

    由于缺的题目比较多,竟然高达3题,所以再写一篇补题的博客 Lpl and Energy-saving Lamps During tea-drinking, princess, amongst othe ...

  5. Welcome-to-Swift-16自动引用计数(Automatic Reference Counting)

    Swift使用自动引用计数(ARC)来跟踪并管理应用使用的内存.大部分情况下,这意味着在Swift语言中,内存管理"仍然工作",不需要自己去考虑内存管理的事情.当实例不再被使用时, ...

  6. 【bzoj2430】[Poi2003]Chocolate 贪心

    题目描述 有一块n*m的矩形巧克力,准备将它切成n*m块.巧克力上共有n-1条横线和m-1条竖线,你每次可以沿着其中的一条横线或竖线将巧克力切开,无论切割的长短,沿着每条横线切一次的代价依次为y1,y ...

  7. hust 1605 - Gene recombination(bfs+字典树)

    1605 - Gene recombination Time Limit: 2s Memory Limit: 64MB Submissions: 264 Solved: 46 DESCRIPTION ...

  8. 20140323组队赛 2012福建省第三届ACM省赛题目

    A - Solve equation Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u ...

  9. 45深入理解C指针之---指针释放

    一.size_t:用于安全表示长度,所有平台和系统都会解析成自己对应的长度 1.定义:size_t类型表示C中任何对象所能表示的最大长度,是个无符号整数:常常定义在stdio.h或stdlib.h中 ...

  10. [Python Cookbook] IPython: An Interactive Computing Environment

    You can launch IPython on the command line just like launching the regular Python interpreter except ...