热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

H5制作虚拟键盘时出现输入框遮挡的情况怎么办?

本文主要介绍了HTML5虚拟键盘出现挡住输入框的解决办法。具有很好的参考价值,下面跟着小编一起来看下吧
本文主要介绍了HTML5 虚拟键盘出现挡住输入框的解决办法。具有很好的参考价值,下面跟着小编一起来看下吧

话不多说,请看代码:

//防止键盘把当前输入框给挡住
$$('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);
        }
    })
}


推荐阅读
  • YB02 防水车载GPS追踪器
    YB02防水车载GPS追踪器由Yuebiz科技有限公司设计生产,适用于车辆防盗、车队管理和实时追踪等多种场合。 ... [详细]
  • Java与JSON互转:实现JSON到Java对象及Java对象到JSON的转换
    本文详细介绍了如何在Java中实现JSON数据与Java对象之间的相互转换,包括代码示例和常见问题解决方法。 ... [详细]
  • Ubuntu GamePack:专为游戏爱好者打造的Linux发行版
    随着Linux系统在游戏领域的应用越来越广泛,许多Linux用户开始寻求在自己的系统上畅玩游戏的方法。UALinux,一家致力于推广GNU/Linux使用的乌克兰公司,推出了基于Ubuntu 16.04的Ubuntu GamePack,旨在为Linux用户提供一个游戏友好型的操作环境。 ... [详细]
  • MySQL锁机制详解
    本文深入探讨了MySQL中的锁机制,包括表级锁、行级锁以及元数据锁,通过实例详细解释了各种锁的工作原理及其应用场景。同时,文章还介绍了如何通过锁来优化数据库性能,避免常见的并发问题。 ... [详细]
  • 本文探讨了如何利用SqlDependency执行复杂的SQL查询,并确保在多线程环境下的安全性与效率。 ... [详细]
  • Python数据类型6 字典
    字典Python的字典数据类型是基于hash散列算法实现的,采用键值对(key:value)的形式,根据key的值计算value的地址,具有非常快的查取和插入速度。但它是无序的,包 ... [详细]
  • 本文详细介绍了ActivityManagerService (AMS) 的工作原理及其在Android系统中的重要角色。AMS作为system_server进程的一部分,在系统启动时加载,负责管理和协调应用程序中的Activity和服务(Service)。文章将通过具体的接口图和通信流程,帮助读者更好地理解AMS的工作机制。 ... [详细]
  • EasyMock实战指南
    本文介绍了如何使用EasyMock进行单元测试,特别是当测试对象的合作者依赖于外部资源或尚未实现时。通过具体的示例,展示了EasyMock在模拟对象行为方面的强大功能。 ... [详细]
  • 题目 CF1245F: 清理春天的数学挑战 描述了一个数学问题:给定一个区间 [L, R](0 ≤ L, R ≤ 10^9),求该区间内满足 x + y = x ∧ y 的数对 (x, y) 的总数。 ... [详细]
  • 本文详细介绍了在使用Socket进行网络编程时,遇到链接器错误`undefined reference to WSAStartup@8`的解决方案,适用于多种开发环境。 ... [详细]
  • 本文详细介绍如何在IntelliJ IDEA 14中打包Android应用APK文件,并提供查询SHA1值的具体步骤。 ... [详细]
  • python开发mysql:单表查询&多表查询
    一单表查询,以下是表内容二多表查询,一下是表内容三总结&表创建过程单 ... [详细]
  • MacOS 重装指南
    本文详细介绍了如何通过U盘启动并重新安装MacOS,包括遇到安装问题时的解决方案。 ... [详细]
  • 如何恢复CAD中意外丢失的图纸数据
    当使用CAD进行绘图时,因突然断电或其他原因导致计算机关闭可能会造成工作数据的丢失。然而,通过利用CAD软件的自动保存功能,用户通常能够恢复至最近一次自动保存的数据状态。 ... [详细]
  • 本文介绍了如何在Mac操作系统中实现对NTFS文件系统的完整读写功能,包括必要的软件安装步骤和配置方法。 ... [详细]
author-avatar
蚂蚁少校
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有