解决ios环境下点击输入框页面被顶起不能自动回弹到底部问题
第一步:在标签的输入框中添加获取焦点事件 代码写法: @focus="getFocus" (vue代码) 可直接拷贝拿去放在自己页面元素中,如下:
<div class="o-field o-grid__cell carinfo-grid__cell">
<input
@blur="onPlaceholderMobleBlur"
@focus="getFocus"
:value="holderMobile"
class="c-field"
type="text"
placeholder="请输入投保人手机号"
maxlength="11">
</div>
第二步:在methods 方法中声明 获取焦点事件 如下写法,下面代码直接拷贝即可
methods: {
getFocus() {
$("input,textarea").on("blur", function() {
window.scroll(0, 0);
});
},
这里引入jQuery(jQuery还是很好用的)
实现原理:
原理就是弹起键盘的时候,window.scrollY会从0变到键盘的高度(例如:200),当输入框焦点失去后让scrollY回到0就好了
或者 这么写只是不需要引入jQuery了
window.addEventListener('focusout', function () {
document.body.scrollTop = document.body.scrollHeight;
})
<div class="o-field o-grid__cell carinfo-grid__cell">
<input
@blur="onPlaceholderMobleBlur"
:value="holderMobile"
class="c-field"
type="text"
placeholder="请输入投保人手机号"
maxlength="11">
</div>
解决ios环境下点击输入框页面被顶起不能自动回弹到底部问题的更多相关文章
- 项目总结10:通过反射解决springboot环境下从redis取缓存进行转换时出现ClassCastException异常问题
通过反射解决springboot环境下从redis取缓存进行转换时出现ClassCastException异常问题 关键字 springboot热部署 ClassCastException异常 反射 ...
- event.preventDefault() 解决按钮多次点击 导致页面变大
event.preventDefault() 解决按钮多次点击 导致页面变大
- egret 篇——关于ios环境下微信浏览器的音频自动播放问题
前段时间公司突然想用egret(白鹭引擎)做一个金币游戏,大半个月边看文档边写吭哧吭哧也总算是弄完了.期间遇到一个问题,那就是ios环境下微信浏览器的音频自动播放问题. 个人感觉吧,egret自己封装 ...
- vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟,连续点击无反应的问题
异常描述: ios系统手机中访问h5页面,按钮点击有延迟,连续点击卡顿.无反应. 异常原因: 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题:当时的网站都是为大屏幕设 ...
- 解决中文环境下zabbix监控图形注释乱码
zabbix监控的图形界面能够更直观的查看监控状态,当我们把zabbix的语言切换为中文的时候,会发现监控图形中一些中文参数会乱码,例如下面的效果 但是图形界面在原生的英文环境下完全没有乱码问题.为了 ...
- 解决linux环境下nohup: redirecting stderr to stdout问题
在生产环境下启动Weblogic时,发现原来好好的nohup信息输出到指定文件中的功能,突然出问题了.现象是控制台输出的信息一部分输出到了我指定的文件,另一部分却输出到了nohup.out,而我是不想 ...
- 解决linux环境下qt groupbox 边框不显示问题
ps:实践是检验真理的唯一标准真的是没错,以为很简单一件事情,往往被自己搞的很复杂,这里记录下 在windows环境中Qt创建一个groupbox自动显示边框, 效果如下 然而在linux环境中Qt创 ...
- 解决LNMP环境下WordPress后台缺少”WP-ADMIN”路径
LNMP一键安装包也是老左比较喜欢使用的环境之一,昨天帮助一个网友搭建LNMP环境后发现登陆WP后台之后点击左侧的菜单发现直接跳转404错误,开始还以为数据库问题,视线朝上一看原来在地址栏中的路径缺少 ...
- 解决Linux环境下安装xampp之后外部无法连接MySQL的问题
在Linux系统下,开发PHP一般都是LAMP环境,对于开发环境来讲,没有必要花太大精力去单独配置LAMP环境,采用xampp一键安装包是一个很好的方式.在Linux系统上安装xampp的过程这里就不 ...
随机推荐
- vim操作:打开多个文件、同时显示多个文件、在文件之间切换
打开多个文件: 1.vim还没有启动的时候: 在终端里输入 vim file1 file2 ... filen 便可以打开所有想要打开的文件 2.vim已经启动 输入 :open file 可以再打开 ...
- swagger页面详细讲解
- 修改GIT已提交的用户名和邮箱
修改GIT已提交的用户名和邮箱 原文:https://help.github.com/en/github/using-git/changing-author-info 说明 要更改在现有提交中记录的名 ...
- ArmIE的安装
参考:https://developer.arm.com/tools-and-software/server-and-hpc/arm-architecture-tools/arm-instructio ...
- Python实现十大经典排序算法(史上最简单)。
十大排序算法(Python实现)一. 算法介绍及相关概念解读 算法分类十种常见排序算法可以分为两大类: 非线性时间比较类排序:通过比较来决定元素间的相对次序,由于其时间复杂度不能突破O(nlogn), ...
- asp.net core mvc基于Redis实现分布式锁,C# WebApi接口防止高并发重复请求,分布式锁的接口幂等性实现
使用背景:在使用app或者pc网页时,可能由于网络原因,api接口可能被前端调用一个接口重复2次的情况,但是请求内容是一样的.这样在同一个短暂的时间内,就会有两个相同请求,而程序只希望处理第一个请求, ...
- vmware-vmx.exe进程应该怎么杀掉
如何解决VMware-vmx.exe无法彻底删除的问题 遇见的问题就是 虚拟机一直黑屏,强制关机之后,无法再次打开的问题. 显示:无法创建新虚拟机: 无法打开配置文件 以独占方式锁定此配置文件失败.另 ...
- linux防止恶意采集攻防战
这两天ytkah开发的一个中大型项目被人盯上了,网站打开非常慢,查看了一下cpu.内存使用情况,30%左右占用不高,网络上下行就比较大了,IO实时流量达到40MB,IO总流量更是7TB,非常大的数据量 ...
- 补充:垃圾回收机制、线程池和ORM缺点
补充:垃圾回收机制.线程池和ORM缺点 垃圾回收机制不仅有引用计数,还有标记清除和分代回收 引用计数就是内存地址的门牌号,为0时就会回收掉,但是会出现循环引用问题,这种情况下会导致内存泄漏(即不会被用 ...
- mdk编译器学习笔记(1)——序
这两天,学习了keil-mdk编译器的特性,这基本上独立于c语言语法,平时基本上都在强调c语言的学习,但是编译器的学习我们也要注重,类似于gcc一样,不也有很多网上的资料,讲述gcc的特性和用法吗.作 ...