HTML5 虚拟键盘出现挡住输入框的解决办法


Posted in HTML / CSS onFebruary 14, 2017

话不多说,请看代码:

//防止键盘把当前输入框给挡住
$$('input[type="text"],textarea').on('click', function () {
  var target = this;
  setTimeout(function(){
        target.scrollIntoViewIfNeeded();
   },100);
});

部分安卓机型适用。

if(/Android [4-6]/.test(navigator.appVersion)) {
    window.addEventListener("resize", function() {
        if(document.activeElement.tagName=="INPUT" || document.activeElement.tagName=="TEXTAREA") {
            window.setTimeout(function() {
document.activeElement.scrollIntoViewIfNeeded();
            },0);
        }
    })
}

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

HTML / CSS 相关文章推荐
CSS3中的opacity属性使用教程
Aug 19 HTML / CSS
利用简洁的图片预加载组件提升html5移动页面的用户体验
Mar 11 HTML / CSS
H5仿微信界面教程(一)
Jul 05 HTML / CSS
解决H5的a标签的download属性下载service上的文件出现跨域问题
Jul 16 HTML / CSS
HTML5 canvas基本绘图之图形组合
Jun 27 HTML / CSS
H5混合开发app如何升级的方法
Jan 10 HTML / CSS
HTML5实现移动端复制功能
Apr 19 HTML / CSS
canvas绘制圆角头像的实现方法
Jan 17 HTML / CSS
html5 video全屏播放/自动播放的实现示例
Aug 06 HTML / CSS
一个基于canvas的移动端图片编辑器的实现
Oct 28 HTML / CSS
css3实现的加载动画效果
Apr 07 HTML / CSS
浅谈css清除浮动(clearfix和clear)的用法
May 21 HTML / CSS
Html5中localStorage存储JSON数据并读取JSON数据的实现方法
Feb 13 #HTML / CSS
HTML5为输入框添加语音输入功能的实现方法
Feb 06 #HTML / CSS
HTML5拖拉上传文件的简单实例
Jan 11 #HTML / CSS
如何用H5实现一个触屏版的轮播器的实例
Jan 09 #HTML / CSS
HTML5+CSS3模仿优酷视频截图功能示例
Jan 05 #HTML / CSS
HTML5实现文件断点续传的方法
Jan 04 #HTML / CSS
HTML5+css3:3D旋转木马效果相册
Jan 03 #HTML / CSS
You might like
浅析php变量修饰符static的使用
2013/06/28 PHP
PHP、Java des加密解密实例
2015/04/27 PHP
PHP实现双链表删除与插入节点的方法示例
2017/11/11 PHP
PHP设计模式之工厂模式(Factory Pattern)的讲解
2019/03/21 PHP
js 目录列举函数
2008/11/06 Javascript
javascript写的简单的计算器,内容很多,方法实用,推荐
2011/12/29 Javascript
jQuery 阴影插件代码分享
2012/01/09 Javascript
ie7+背景透明文字不透明超级简单的实现方法
2014/01/17 Javascript
javascript中2个感叹号的用法实例详解
2014/09/04 Javascript
基于jQuery实现动态搜索显示功能
2016/05/05 Javascript
Angular2 PrimeNG分页模块学习
2017/01/14 Javascript
JS实现多张图片预览同步上传功能
2017/06/23 Javascript
three.js实现炫酷的全景3D重力感应
2018/12/30 Javascript
Vue使用axios出现options请求方法
2019/05/30 Javascript
node实现简单的增删改查接口实例代码
2019/08/22 Javascript
JS实现无限轮播无倒退效果
2020/09/21 Javascript
Python编程中的反模式实例分析
2014/12/08 Python
详细介绍Python中的偏函数
2015/04/27 Python
简单谈谈Python中的反转字符串问题
2016/10/24 Python
python3中str(字符串)的使用教程
2017/03/23 Python
python Celery定时任务的示例
2018/03/13 Python
PyCharm代码格式调整方法
2018/05/23 Python
python的移位操作实现详解
2019/08/21 Python
Python基于traceback模块获取异常信息
2020/07/23 Python
Python限制内存和CPU使用量的方法(Unix系统适用)
2020/08/04 Python
python 第三方库paramiko的常用方式
2021/02/20 Python
html5 figure和figcaption的使用方法
2018/09/10 HTML / CSS
教师实习自我鉴定
2013/12/14 职场文书
高二生物教学反思
2014/01/27 职场文书
动员大会主持词
2014/03/20 职场文书
法人单位授权委托书范文
2014/10/06 职场文书
2015年世界粮食日演讲稿
2015/03/20 职场文书
2015年新农合工作总结
2015/03/30 职场文书
2019年学校消防安全责任书(2篇)
2019/10/09 职场文书
MySQL优化常用的19种有效方法(推荐!)
2022/03/17 MySQL
python中的getter与setter你了解吗
2022/03/24 Python