h5 ios移动端,键盘收起以后页面不归位
$('input,textarea').on('blur',function(){
window.scroll(0,0);
});
$('select').on('change',function(){
window.scroll(0,0);
});
document.body.addEventListener('focusout', function () {
window.scrollTo(0, 0);
})
失去焦点后,重新让滚动条滚动到之前的位置
$("input").blur(function () {
setTimeout(function() {
var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
window.scrollTo(0, Math.max(scrollHeight - 1, 0));
}, 100);
});
失去焦点以后重新设置页面顶部位置
h5 ios移动端,键盘收起以后页面不归位的更多相关文章
- h5 ios输入框与键盘 兼容性优化
起因 h5的输入框引起键盘导致体验不好,目前就算微信.知乎.百度等产品也没有很好的技术方案实现,尤其底部固定位置的输入框各种方案都用的前提下体验也并没有很好,这个问题也是老大难问题了.目前在准备一套与 ...
- H5页面移动端IOS键盘收起焦点错位
出现场景:IOS端,在弹出层点击input时调起键盘页面会被顶上去document.body.scrollOffset大于0,收起键盘时scrollOffset不变,造成焦点错位. 注:安卓手机点击时 ...
- 解决微信H5页面软键盘弹起后页面下方留白的问题(iOS端)
前言:微信H5项目,ios端出现了软键盘输完隐藏后页面不会回弹,下方会有一大块留白 最近微信和ios都有版本升级,不知道是哪边升级造成的,但是经过测试,软键盘收起后,再滚动一下页面,下面的留白就会消失 ...
- web中ios移动端软键盘收起后,页面内容留白不下滑
微信里面打开web页面,在ios软键盘收起时,页面键盘位置的内容留白,如下图 这个问题纠结了很久,然后请教了老大(威哥),看到页面老大给出的方案就是代码改变滚动条的位置. 这里就监听键盘收起的事件,来 ...
- 移动端input输入框把页面顶起, 收起键盘页面复原不了问题
我相信大家平时也会遇到这种问题, 移动端 input 或者 textarea获取光标, 整个页面被顶起来, 键盘收起, 页面不复原的问题 ====>>>> 我这边提供两种解决 ...
- IOS键盘收起后,页面底部留白处理
环境:vue+vant 的H5页面 场景:输入框输入信息时,如登录.注册等表单信息 问题:键盘收回后页面底部留白,导致dialog组件按钮位移,视觉上,其中的按钮无法正常工作 解决方案:监听失去焦点时 ...
- H5 移动端 键盘遮挡焦点元素解决方案
前言 最近在做 webapp,遇到了很多移动端兼容的问题,其中一个问题就是:输入框触发 focus 后,键盘弹出,然后遮住了输入框. 然后在Android和IOS上,这个问题的表现形式不一样,而原生键 ...
- uni-app 在input获取焦点(弹出软键盘后收起软键盘),页面不下滑,留下下方空白
加入收起软键盘时让页面回正 uni.pageScrollTo({ scrollTop: 0, duration: 0 });
- 解决ios移动端双击页面下移
ios移动端在双击弹出层的时候会出现页面下移,露出底层页面的现象 解决办法: <!DOCTYPE html> <html> <head> <meta char ...
随机推荐
- javascript中优雅的处理async和await异常
let handler = async function(needErr) { return new Promise((resolve, reject) => { if (needErr) { ...
- 新安装ubuntu系统的简单优化
新安装的ubuntu系统,需要做下简单的优化,使其符合常用习惯,优化过程的命令与centos大都不一致,撰文备份,以备所需: 1.获取ubuntu系统root权限 在终端输入sudo passwd r ...
- tensorflow2.0安装
版本: python3.5 Anaconda 4.2.0 tensorflow2.0 cpu版本 1.安装命令 pip3 install tensorflow==2.0.0.0a0 -i https: ...
- LeetCode 706:设计哈希映射 Design HashMap
题目: 不使用任何内建的哈希表库设计一个哈希映射 具体地说,你的设计应该包含以下的功能 put(key, value):向哈希映射中插入(键,值)的数值对.如果键对应的值已经存在,更新这个值. get ...
- 【Linux】Linux 性能瓶颈阈值分析
Linux系统资源包括:CPU.IO(磁盘和网络).内存等 利用率达到三个阶段时: 1)50% 引起注意 2)70% 密切关注 3)90% 严重情况 vmstat.sar.iostat.mpstat. ...
- java线程join方法使用方法简介
本博客简介介绍一下java线程的join方法,join方法是实现线程同步,可以将原本并行执行的多线程方法变成串行执行的 如图所示代码,是并行执行的 public class ThreadTest { ...
- Disruptor系列(二)— disruptor使用
本文译自Dirsruptor在github上的wiki中文章:Getting Started 获取Disruptor Disruptor jar包可以从maven仓库mvnrepository获取,可 ...
- java war包 路径--解决war包中文件路径问题
https://blog.csdn.net/u013409283/article/details/51480948 转自:http://free-chenwei.iteye.com/blog/1507 ...
- solidity 智能合约之间的调用
智能合约之间的调用 在区块链上,有些功能往往无法通过一个智能合约完成,此时便会用到智能合约之间的调用.本篇文章带大家通过具体示例来了解一下智能合约之间的调用. 在智能合约的编译过程中,有两种情况:调用 ...
- Set a One-to-Many Relationship设置一对多关系 (XPO)
In this lesson, you will learn how to set a one-to-many relationship between business objects. The C ...