解决input失焦后页面没有回弹

最新推荐文章于 2023-07-24 17:22:30 发布
最新推荐文章于 2023-07-24 17:22:30 发布
阅读量841 收藏 2
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fangxin222/article/details/102551247
版权

一般出现在IOS设备中的微信内部浏览器，出现的条件为：

  • 页面高度过小
  • 聚焦时，页面需要往上移动的时候

所以一般input在页面上方或者顶部都不会出现无法回弹?

解决办法为，在聚焦时，获取当前滚动条高度，然后失焦时，赋值之前获取的高度：

 

 

 

尘世中一位迷途小书童
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
input失去焦点验证格式_表单验证之失去焦点校验
weixin_36268390的博客
01-17 1345
使用场景：会员名、标题等唯一性校验效果图1.HTML部分添加备注：data-rule="required;remote(get:archives/check_title_available)"这句话的含义：校验规则required 必填remote(get:archives/check_title_available) 访问地址为archives/check_title_available，控制器...
文本框input聚焦失焦样式实现代码
09-05
本框input聚焦失焦样式实现代码，需要的朋友可以参考下
H5微信页面开发 IOS系统 input输入框失去焦点，软键盘关闭后，被撑起的页面无法回退到原来正常的位置，导致弹框里的按钮响应区域错位
热门推荐
weixin_42573146的博客
12-17 1万+
H5微信页面开发，软键盘弹起后，若原输入框被遮挡，页面整体将会上移，然而当输入框失焦，软键盘收起后，页面未恢复，导致弹框里的按钮响应区域错位。 解决方案：给输入框（或select选择框）添加失去焦点的事件，当输入框失去焦点，页面自动滚动到顶部，并且需要加定时器，否则偶尔会失效， $("input,select").blur(function(){ setTimeout(fun...
软键盘遮挡input和input失焦后不回滚的解决办法
besttoby01的博客
03-05 505
对安卓手机和苹果手机两种不同的情况分析。 安卓：部分安卓机聚焦的时候，软键盘会遮挡住input。 原因：软键盘拉起的时候，页面的高度变小了。部分安卓机聚焦的input不会自动滚动到指定位置，所以我们可以监听当窗口改变时，让当前聚焦的元素滚动到指定位置（scrollIntoViewIfNeeded）。我们也可以对单个input的聚焦函数添加事件，但是那样子有一定的局限性。重复且啰嗦。 i...
移动端input输入框失去焦点，页面视觉回弹，但实际并没回弹
MtangEr的博客
02-20 9420
input输入框失去焦点，页面视觉回弹，但实际并没回弹，添加blur事件 在移动端，当点击输入框时，弹出软键盘，页面被顶上去一截，当输入完毕失去焦点，软键盘关闭时，页面弹回弹回恢复正常（这里关闭软键盘，页面没有弹回的参考 https://blog.csdn.net/MtangEr/article/details/86552257 ），但是页面上的按钮绑定的一些事件就不能触发，如点击事件； 其中...
解决移动端H5页面软键盘弹起input失焦后不回弹底部
荤素菜鸟的博客
02-02 877
**给input添加@blur失去焦点事件** <view class="label iconfont iconlock"> <input type="text" placeholder="真实姓名" placeholder-class="place" v-model="formData.realName" @blur.prevent="inputLoseFocus"/> </view> **解决方法函数** inputLoseFocus() { let cur
详解小程序input框失焦事件在提交事件前的处理
10-17
主要介绍了详解小程序input框失焦事件在提交事件前的处理，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Angular移动端页面input无法输入的解决方法
08-28
下面小编就为大家带来一篇Angular移动端页面input无法输入的解决方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
h5手机端在输入框失去焦点后页面没有滑动到原来位置。
sdfujichao的博客
12-17 3077
在手机端经常会写输入框提交信息，有的输入框位置比较靠底部，所以点击输入框的时候浏览器会自动把页面网上滑动，但是输入完成后，也就是这个输入框失去焦点的时候页面并没有滑下来。 解决办法 1：可以用浏览器提供的这个方法来实现scrollIntoView 这个方法可以绑定给任意元素，让他们滑动，具体使用方法查看旭哥的这篇文章吧，就算我费劲写一顿也不如旭哥写的更有深度。CSS scroll-behavi...
解决移动端input失去焦点软键盘收齐后界面不恢复的问题
guanguan0_0的博客
10-16 1154
<input placeholder="请输入" @blur="lost()" /> lost() { setTimeout(() => { let scrollHeight = document.documentElement.scrollTop || document.body.scrollTop |...
解决手机端input失焦后页面不还原和android软键盘出现后挤压页面问题
rouduo_zjy的博客
11-21 771
input失去焦点后使用window.scroll属性页面可以回到指定地 手机端页面输入框失去焦点后页面不会自动还原的解决方法 //input框失去焦点后页面回到（0,0） $("input").on("blur",function(){ window.scroll(0,0); }); //textarea框失去焦点后页面回到（0,0） $("textarea").on("blur",fun...
根据卡号自动回填其它信息（失去焦点事件）
weixin_44571808的博客
07-17 153
回填信息的时候，有多种方式回填，有根据ID回填数据，有根据输入其中一个input框回填数据。而我是根据卡号回填数据，输入卡号，其它数据字动回填。在控制器上查询表格所有的数据，因为要根据卡号来回填数据，所以参数名为卡号的字段名。 (日期转换见数据类型转换：https://blog.csdn.net/weixin_44571808/article/details/93922217） 挂号日期数据回...
js input 鼠标点击清除提示内容，失去焦点还原默认内容的方法
lewlin2008的专栏
09-28 7537
js input 鼠标点击清除提示内容，失去焦点还原默认内容的方法=======================================function clearDefaultText (el,message){var obj = el;if(typeof(el) == "string")obj = document.getElementById(id);if(obj.value ==
input的失焦事件处理
qq_25741071的博客
11-17 791
【代码】input的失焦事件处理。
input框失焦bug问题解决
最新发布
wyzh2000的博客
07-24 746
本文主要讲解input框失焦时事件触发时可能造成的bug与解决方案
react Input组件输入字符串，失去焦点，需要重新点击获取焦点
weixin_48496520的博客
08-12 2083
出错的伪代码如下： import { Input } from 'antd' ... let arr = [1, 2, 3, 4] ... return ( <div> { arr.map((item) => { return ( <Input key={Math.random()} onChange={(value)=>{ console.log(value
让所有的input失去焦点
weixin_44432032的博客
04-22 897
//表单的提交 $("form").submit(function() { //让input框触发失去焦点事件 $("input").trigger("blur"); // return true; })
inputNumber选中状态如果被打断，会保存现状态，之后会回填状态。
m0_48367310的博客
08-18 277
inputNumber 在onblur的状态下，如果突然出现一个弹窗，这种时候会打断状态, 等弹窗消失，会重新保存当时的onblur 状态。 这种时候如歌弹窗的作用是修改input的值，等弹窗消失之后input的值就有可能出现怪异现象，可能会回到当时onblur的值。 解决这种现在现象，可以做一个全局监控， 满足条件之后，获取input框，然后失去焦点。 也可以使用ref , ref?.current.blur(); 失去焦点。 ...
解决antdv 中input每输入一个字符就失去焦点
m0_53383900的博客
10-21 2737
解决antdv 中input每输入一个字符就失去焦点
angular中input失焦后触发事件
05-27
在Angular中，可以使用 `(blur)` 事件来监听input元素的失焦事件。例如： ``` <input (blur)="onBlur()"> ``` 在组件中定义 `onBlur()` 方法来处理失焦事件，例如： ``` @Component({ selector: 'app-my-input',...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值