当界面元素靠下时候的时候,input输入框会被系统的键盘遮挡。

我们可以让界面向上移动一定距离去避免遮挡。

  $('#money').click(function(){
setTimeout(function(){
$(this).scrollIntoView(); // 参数可以是true, false, 空参数
}, 300);
})

基于jquery写的事件。

首先绑定触发元素(input)框,scrollIntoView(alignWithTop)  属性滚动浏览器窗口或容器元素,以便在当前视窗的可见范围看见当前元素。

click事件触发的时候,输入框会向上移动,移动的范围是界面可见的程度。后面参数是延时操作的时间。

单位是毫秒。

移动端,input输入框被手机输入法解决方案的更多相关文章

  1. 移动端input“输入框”常见问题及解决方法

    转自 https://www.cnblogs.com/ljx20180807/p/9837748.html 1. ios中,输入框获得焦点时,页面输入框被遮盖,定位的元素位置错乱: 当页input存在 ...

  2. 移动端input输入框把页面顶起, 收起键盘页面复原不了问题

    我相信大家平时也会遇到这种问题, 移动端 input 或者 textarea获取光标, 整个页面被顶起来, 键盘收起, 页面不复原的问题 ====>>>>  我这边提供两种解决 ...

  3. IOS11 底部输入框被手机输入法遮住

    前言: 最近在做一个评论的功能,前端页面中输入评论框在页面的最底部,在ios11中手机的输入法会遮住那个输入框,在其它手机上正常. 一直在找有关的解决方案,虽然最终也没有解决,还是记录过程,供参考. ...

  4. 移动端 input 输入框实现自带键盘“搜索“功能并修改X

    主要利用html5的,input[type=search]属性来实现,此时input和type=text外观和功能没啥区别: html代码入下: <form action="" ...

  5. 移动端页面输入法挡住input输入框的解决方法

    1,宽高用了百分比或者vw/vh布局的,input输入框的最外层父容器的可用JS动态设置为当前窗口的宽高(防止输入法的弹出令页面变形) 2,最外层父容器用了fixed定位的,不要用top:0;要用bo ...

  6. 点击底部input输入框,弹出的软键盘挡住input(苹果手机使用第三方输入法 )

    测试移动端页面的时候,偶然发现点击底部input输入框时,弹出的虚拟键盘偶尔会挡住input输入框. 输入框固定在页面底部,如图所示:   input固定底部设计图.png 点击底部input输入框唤 ...

  7. 项目小结:手机邮箱正则,URL各种判断返回页面,input输入框输入符合却获取不到问题

    1.手机邮箱正则 近两年出来很多新号码,听说199什么的都有了- -导致以前的正则不能用了....这就很难过,总是过一段时间出一种新号码.因此,我决定使用返朴归真的手机正则. 手机正则:var reg ...

  8. 解决手机浏览器上input 输入框导致页面放大的问题(记录)

    在微信手机页面开发当中,页面是没有问题的,但是当焦点在input输入框的时候,手机页面会自动放大. 加入以下代码在head 区,可解决此问题 <meta name="viewport& ...

  9. IOS 固定定位底部input输入框,获取焦点时弹出的输入法键盘挡住input

    移动页面经常会做到这样一个效果,看下面的图片,重点就是那个固定定位的底部,里面有个input输入框,在输入字符的时候,安卓手机看着是完全没有问题! 1.页面没有点击底部input的初始状态 2.安卓手 ...

随机推荐

  1. MYSQL数据库学习十一 多表数据记录查询

    11.1 关系数据操作 并(UNION):把具有相同字段数目和字段类型的表合并到一起. 笛卡尔积(CARTESIAN PRODUCT):没有连接条件表关系的返回结果.字段数=table1字段数+tab ...

  2. 《UNIX网络编程 卷1:套接字联网API》读书笔记(一):网络编程简介

    概述 要编写通过计算机网络通信的程序,首先要确定这些程序相互通信所用的协议.大多数网络是按照划分成客户和服务器来组织的.本章及后续章节的焦点是TCP/IP协议族,也可称为网际协议族.下图为客户与服务器 ...

  3. Notepad++中实现Markdown语法高亮与实时预览

    Notepad ++是一个十分强大的编辑器,除了可以用来制作一般的纯文字说明文件,也十分适合编写计算机程序代码.Notepad ++不仅有语法高亮度显示,也有语法折叠功能,并且支持宏以及扩充基本功能的 ...

  4. JavaWeb学习笔记九 过滤器、注解

    过滤器Filter filter是对客户端访问资源的过滤,符合条件放行,不符合条件不放行,并且可以对目标资源访问前后进行逻辑处理. 步骤: 编写一个过滤器的类实现Filter接口 实现接口中尚未实现的 ...

  5. C语言博客作业—指针

    一.PTA实验作业 题目1: 求出数组中最大数和次最大数 1. 本题PTA提交列表 2. 设计思路 定义max表示范围数组中的最大数(初值设为a[0]),z表示找到的元素在数组中的位置: 定义指针*b ...

  6. Android开发简易教程

    Android开发简易教程 Android 开发因为涉及到代码编辑.UI 布局.打包等工序,有一款好用的IDE非常重要.Google 最早提供了基于 Eclipse 的 ADT 作为开发工具,后来在2 ...

  7. Python 双向链表

    操作 is_empty() 链表是否为空 length() 链表长度 travel() 遍历链表 add(item) 链表头部添加 append(item) 链表尾部添加 insert(pos, it ...

  8. vim配置之taglist插件安装

    上次说了不带插件的vim配置,今天补充两个,来日方长,不定期更新: 首先看一个路径: 下载ctags,将其中的ctags.exe复制到上边目录下边: 地址:https://sourceforge.ne ...

  9. Solr搜索引擎搭建详细过程

    1    什么是solr Solr 是Apache下的一个顶级开源项目,采用Java开发,它是基于Lucene的全文搜索服务器.Solr可以独立运行在Jetty.Tomcat等这些Servlet容器中 ...

  10. 坑爹了多少年的html元素垂直居中问题

    原文章:https://www.w3cplus.com/css3/a-guide-to-flexbox.html 如果你的元素有固定高度的话 父元素用display: flex;height:100p ...