H5输入框在输入信息的时候 页面会变形 并且在页面不变形的时候 键盘会遮挡 输入框的解决办法

$(document).ready(function () { $(‘body‘).css({‘height‘:$(window).height()})});//这行是解决输入框在输入信息弹出键盘后页面变形
 $(function () {
//微信内置浏览器浏览H5页面弹出的键盘遮盖文本框的解决办法
window.addEventListener("resize", function () {
     if (document.activeElement.tagName == "INPUT" || document.activeElement.tagName == "TEXTAREA") {
     window.setTimeout(function () {
    document.activeElement.scrollIntoViewIfNeeded();
    }, 0);
   }
   })
})

原文地址:https://www.cnblogs.com/lzk318/p/9247910.html

时间: 2024-10-14 22:50:10

H5输入框在输入信息的时候 页面会变形 并且在页面不变形的时候 键盘会遮挡 输入框的解决办法的相关文章

js代码从页面移植到文件中失效或js代码修改后不起作用的解决办法

最近在做关于网站的项目,总是发生这样的问题 写的javascript代码在页面上没有问题,但是将js代码移植到.js的文件中,在页面上进行调用,总是出现失效等错误 另外修改后的js代码,重新刷新网页仍然不起作用 经过大量搜索并经过验证,可以用下面方法来解决 将js代码封装到js文件中失效的原因可能是js文件中存在中文注释,导致在执行的时候中断,在js文件尽量不要写中文注释 修改后的js代码刷新网页后不起效果可能是因为你所用的浏览器使用缓存的问题,可在浏览器中设置取消使用缓存,并删除临时文件,重启

Android WebView中软键盘会遮挡输入框相关问题

要想实现这样的软键盘出现的时候会自己主动把输入框的布局顶上去的效果,须要设置输入法的属性,有下面两种设置方式: 一.在java代码中设置例如以下: getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE| WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN); 二.在androidmanifest.xml中设置与其相应的activity的属性

微信内置浏览器浏览H5页面弹出的键盘遮盖文本框的解决办法

Android微信内置浏览H5页面,因为其中的文本输入框(input)放置在靠近页面的中下方,点击文本框以后,则输入框会被弹出的手机输入法键盘遮盖住. 找到一段js代码直接解决之,点击时强制滚动之,好像也解决了在Android浏览器下浏览的同样问题. 1 if(/Android [4-6]/.test(navigator.appVersion)) { 2 window.addEventListener("resize", function() { 3 if(document.activ

js 页面history.back()返回上一页,ios 不重新加载ready的解决办法

参考自 http://blog.csdn.net/hbts_901111zb/article/details/76691900 项目中,主页面有很多输入字段,当由主页跳转到子页面, 将子页面的字段 set入localstorage中, 由于返回主页面不能将先前输入的字段刷新掉,所以必须要在子页面history.back(). 但由于ios和安卓机制不同,安卓会重新刷新主页面的ready, ios则不会.解决方案如下: 1 $(function () { 2 var isPageHide = fa

安卓H5软键盘遮挡输入框

<div class="label"> * <span><?php echo lang('receive_email_info'); ?></span> <input class="r-email" type="text" placeholder="<?php echo lang('please_in_receive_email'); ?>3333"> &

LinearLayout详解四:彻底解决软键盘遮挡输入框的问题

之前把预备知识都介绍完了,话说学以致用,接下来我们要通过重载LinearLayout类来解决软键盘覆盖的问题. 首先阐述一下这个问题,如下图所示: 然后看挡住输入框的情况 然后我们给出xml的源代码: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:lay

向JSP页面输入信息

/** * ajax responseTEXT write; * @param request * @param response * @param str */ public static void response(HttpServletRequest request,HttpServletResponse response,String str) { response.setContentType("html/text;charset=utf-8"); try { respons

常见的移动端H5页面开发遇到的坑和解决办法

转自:https://www.cnblogs.com/LiuJL/p/7744473.html 1.安卓浏览器看背景图片,有些设备会模糊. 用同等比例的图片在PC机上很清楚,但是手机上很模糊,原因是什么呢? 经过研究,是devicePixelRatio作怪,因为手机分辨率太小,如果按照分辨率来显示网页,这样字会非常小,所以苹果当初就把iPhone 4的960640分辨率,在网页里只显示了480320,这样devicePixelRatio=2.现在android比较乱,有1.5的,有2的也有3的.

JavaScript控制输入框只能输入非负正整数

1.问题背景 问题:一个输入框,输入的是月份,保证输入的内容只能是非负正整数 2.JavaScript代码 function checkMonth() { $("month").keyup(function(){ var temp = $(this).val(); $(this).val(temp.replace(/ \ D/^0/g,'')); })bind("paste",function(){ var temp = $(this).val(); $(this)