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图片边框border-image的用法
Jun 30 HTML / CSS
使用css3匹配手机屏幕横竖状态
Jan 27 HTML / CSS
纯css3实现图片翻牌特效
Mar 10 HTML / CSS
基于Canvas+Vue的弹幕组件的实现
Jul 23 HTML / CSS
HTML5 实战PHP之Web页面表单设计
Oct 09 HTML / CSS
一张图片能隐含千言万语之隐藏你的程序代码
Dec 13 HTML / CSS
html5使用canvas实现弹幕功能示例
Sep 11 HTML / CSS
HTML5离线应用与客户端存储的实现
May 03 HTML / CSS
HTML5触摸事件实现移动端简易进度条的实现方法
May 04 HTML / CSS
HTML5之消息通知的使用(Web Notification)
Oct 30 HTML / CSS
html5中嵌入视频自动播放的问题解决
May 25 HTML / CSS
HTML5超文本标记语言的实现方法
Sep 24 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
PHPUnit PHP测试框架安装方法
2011/03/23 PHP
php中fgetcsv()函数用法实例
2014/11/28 PHP
为PHP5.4开启Zend OPCode缓存
2014/12/26 PHP
jQuery live
2009/05/15 Javascript
Javascript模块化编程(一)模块的写法最佳实践
2013/01/17 Javascript
用jQuery获取IE9下拉框默认值问题探讨
2013/07/22 Javascript
JQuery实现动态表格点击按钮表格增加一行
2014/08/24 Javascript
JQuery中DOM事件绑定用法详解
2015/06/13 Javascript
Javascript技术难点之apply,call与this之间的衔接
2015/12/04 Javascript
Bootstrap入门书籍之(一)排版
2016/02/17 Javascript
简介EasyUI datagrid editor combogrid搜索框的实现
2016/04/01 Javascript
jquery实现全选和全不选功能效果的实现代码【推荐】
2016/05/05 Javascript
详解BootStrap中Affix控件的使用及保持布局的美观的方法
2016/07/08 Javascript
Bootstrap学习笔记 轮播(Carousel)插件
2017/03/21 Javascript
vue props传值失败 输出undefined的解决方法
2018/09/11 Javascript
在create-react-app中使用sass的方法示例
2018/10/01 Javascript
js实现手表表盘时钟与圆周运动
2020/09/18 Javascript
使用go和python递归删除.ds store文件的方法
2014/01/22 Python
python 获取当天凌晨零点的时间戳方法
2018/05/22 Python
用Python3创建httpServer的简单方法
2018/06/04 Python
python中多层嵌套列表的拆分方法
2018/07/02 Python
解决python2 绘图title,xlabel,ylabel出现中文乱码的问题
2019/01/29 Python
python爬虫之验证码篇3-滑动验证码识别技术
2019/04/11 Python
PyQt5 实现给窗口设置背景图片的方法
2019/06/13 Python
python实现学生成绩测评系统
2020/06/22 Python
numpy实现RNN原理实现
2021/03/02 Python
Hotels.com台湾:饭店订房网
2017/09/06 全球购物
办护照工作证明范本
2014/01/14 职场文书
电子工程求职信
2014/07/17 职场文书
产品委托授权书范本
2014/09/16 职场文书
司机工作自我鉴定
2014/09/19 职场文书
领导班子在批评与自我批评座谈会上的发言
2014/09/28 职场文书
群众路线剖析材料
2014/09/30 职场文书
网络新闻该怎么写?这些写作技巧你都知道吗?
2019/08/26 职场文书
100句拼搏进取的名言警句,值得一读!
2019/10/07 职场文书
南阳市白酒市场的调查报告
2019/11/08 职场文书