IOS11 弹窗上文本框光标错位问题

最新推荐文章于 2022-05-06 19:01:10 发布
最新推荐文章于 2022-05-06 19:01:10 发布
阅读量7k 收藏 1
点赞数
CC 4.0 BY-SA版权
分类专栏： Web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/u012116457/article/details/79103598
本文提供了一种针对iOS升级至11版本后，移动端页面上弹窗内的文本框光标出现错位问题的具体解决方案，并附上了有效的修复链接。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

无意中发现了一个巨牛的人工智能教程，忍不住分享一下给大家。教程不仅是零基础，通俗易懂，而且非常风趣幽默，像看小说一样！觉得太牛了，所以分享给大家。点这里可以跳转到教程。

最近遇到个蛋疼的问题，系统的移动端页面在IOS升级到11以后，页面上的弹窗中的文本框的光标会错位，进而导致下面的按钮也无法点击，具体解决方式就直接搬运同行的了，见下面链接

 

https://www.cnblogs.com/zml-mary/p/7816495.html

ios12中遇到的带input弹窗的错位问题的解决方法
08-26
iOS12 中遇到的带 input 弹窗的错位问题的解决方法 在 iOS12 中，使用 fixed 定位的弹窗会遇到一个错位问题。当软键盘调起后，页面整体上移，当软键盘消失时，视觉上页面已经回到原始位置，但其实弹窗的焦点位置仍...
iOS弹窗源码！iOS应用弹窗，自定义弹窗！动态弹窗，OC语言
最新发布
03-10
此外，iOS平台上的弹窗使用还需要遵守Apple的设计指南和开发规范。开发者需要确保弹窗的使用不会干扰用户的正常使用流程，弹窗内容应简洁明了，操作指令清晰，以避免给用户带来困惑或误操作。 在本压缩包文件中，...
ios 设备的移动端页面 光标错位
时间在飞飞的博客
08-04 5247
1.这个问题遇到好多次了，经常是上下错位，原因是在input 获取焦点以后，键盘弹出后，页面网上移动，但是光标停留在了以前的位置，如果页面不复杂，可以在body上添加 position：fixed; 但是这样会引起页面失去滚动能力。目前只能是判断手势，使用js来改变滚动条的位置。为了页面稳定，尽量使用absolute，或者是float，还有flex。 2.在ios 上还有一个问题是，在做一个使用了...
input格式化输入框内容后光标位置错位问题及其解决办法
weixin_43550660的博客
11-24 7834
input格式化输入框内容后定位错位问题 最近公司有一个 汇率换算的小项目 用的 nuxt 服务端渲染，UI用的是饿了么的UI框架，总共 7 个输入框，数据是根据一个输入框中的值进行双向绑定换算的，这些都不是重点。 需求是用户实时输入的时候 input输入框中的值是实时改变的，但是在实时改变的时候，由于数据是千分位格式化了的，当输入的时候，数据就会格式，导致光标会错位，从而导致输入错误 出现这个...
Taro小程序 IOS弹窗输入框聚焦唤起键盘时输入框错位
qq_39561207的博客
05-06 2294
问题描述： 1.弹窗中有上下两个输入框，设置了cursorSpacing属性后，从第一个输入框换到第二个输入框的时候，输入框聚焦位置上下偏移。 原因：cursorSpacing设置了与键盘的距离，不同输入框聚焦的时候，距离键盘位置随时改变，但是页面撑起的距离没来得及变化，造成位置误差。画图补充： 解决办法： 同时设置input框的这两个属性 cursorSpacing="100rpx" always-embed={true} ...
ios系统input光标错位
沫沫酱
06-18 2799
如图： 当浮层是固定定位fixed的时候，ios系统上，input输入框的光标会有错位现象，如上图 目前找到的解决方法是将fixed改为absolute定位。
IOS中position:fixed弹出框中的input出现光标错位的问题
12-01 307
ios11发布后，测试人员反馈回来，键盘弹起时，input光标会定位不准。 后来查了资料，原来是position：fixed，和input一起使用会出现的bug。应该来说，是fixed在移动端支持不怎么好。 解决方案是弹出表单时,给body加一个高度 var h=$(window).height(); $("body,html").css({"overflow":"hidd...
iOS11.3以下modal中input光标错位的解决方法
08-26
* iOS11系统的弹出层内input框光标错位问题。 * 移动端设置body的overflow: hidden不生效的问题。 * 页面回跳到顶部的问题。 通过了解这些问题和限制，可以更好地解决问题，提高开发效率和用户体验。
Android控件PopupWindow模仿ios底部弹窗
01-20
在本文中，我们将探讨如何使用Android的PopupWindow控件来模仿iOS底部弹窗，具体是参照苹果QQ中选择头像的功能。 首先，我们要了解PopupWindow的基本概念。PopupWindow是一个可以显示在屏幕任意位置的浮动窗口，它...
H5仿ios选择弹窗/多级联动选择
07-23
在H5开发中，模拟iOS风格的选择弹窗和多级联动选择是常见的需求，尤其是在移动端应用和网页设计中。这种功能能够提供用户友好的交互体验，使得用户在浏览器环境中也能感受到与原生iOS应用类似的使用体验。下面我们将...
input输入框中光标高度的变化问题
热门推荐
luochao_tj的专栏
01-02 2万+
最近在项目中碰到一个问题： 搜索框的光标高度在有输入内容和为空时发生很大变化。 那么于是在web上搜索了一下前辈们是怎么解决此问题的 首先，先看看问题产生的原因：chrome浏览器对光标高度的设置原则为，当没有内容的时候光标的高度=input的line-height的值，当有内容时，光标从input的顶端到文字的底部。 OK，既然知道了原因，我们就相应才去一些措施。
H5页面IOS中键盘弹出错位的问题
qq_39584800的博客
01-20 2609
H5页面IOS中键盘弹出错位的问题 在实际的开发中，H5的页面在ios系统上可能会遇到这样的问题；就是键盘弹出的时候页面产生错位问题，这会导致在触发事件操作的时候不触发这个事件，解决方法很简单； //jQuery下 $("input").blur(function(){ console.log('失去焦点') window.scrollTo(0,0); });//这样就会完美的解决这...
如何做一个听话的 “输入框”
大转转FE
01-26 1642
前言在移动端的web开发中，一提起输入框，程序猿（媛）肯定有很多可以吐槽的点。在输入框的运用中，小编也是很心累呀~不过，经过我 潜（cai）心（keng）研（jiao）究（xun），也算是了解了它的脾性... ...  特别鸣谢：周涵，家兴等正文这里开始 ? — — — — — — — —问题探究1. ios中，输入框获得焦点时，页面输入框被遮盖，定位的元素位置错乱：当页input存在于吸顶或者吸
修复IOS上滑动HTML界面光标乱跳
qq_33571718的博客
10-29 3177
最近测试人员在测试公司开发的IOS应用时候,IOS是使用混合模式开发，当HTML界面有输入框的时候，点击输入后，滑动界面，光标会固定在屏幕上，不会随着HTML标签滚动；会出现错位，截图如下： 网上说，是因为使用了fixed定位的原因，关键是我所有css样式中都没有使用fixed定位；所以，只能通过其他路径解决问题； 多次测试发现，在我们手指移动到combox，等不能聚焦的标签上，键盘会消失...
H5 IOS input输入框唤起键盘导致页面元素位置错乱问题
qq_37942845的博客
02-12 6778
方法1：vue项目 // 输入框获得焦点时触发 focus() { this.timer.T = setInterval(() => { // 完美解决输入框被软键盘遮挡 this.$refs.footer.scrollIntoView(false) }, 200) }, blur() { // ...
ios 微信移动端web页面input弹出键盘导致页面错乱
mcYang0929的博客
05-15 2706
最近发现，ios移动端Web页面在微信中，input输入框使键盘弹出和收起，导致页面上的位置错乱 问题复现： 我在页面中有一个position:fixed弹层，弹层上面有输入框，当点击输入框的时候，弹出来微信键盘，在输入完毕后，输入框失去焦点，发现页面并没有恢复到底部，这时点击页面上的按钮会错位，导致position为fixed内部的按钮无法点击了。 解决办法： 1.当出现上述问题时，发现...
ios11，弹出层内的input框光标错位 键盘弹出时，输入信息，光标一直乱跳
weixin_30236595的博客
01-23 931
　　之前开发了一个微信项目，维护期中苹果手机突然出现光标错位现象，经过排查，发现是最新的ios11系统的锅。 　　具体情况：弹出层使用position: fixed；弹出层内附带input/textarea输入框，ios11系统的苹果机用户在点击输入框，出现键盘后，弹出层被顶上去，而光标还停留在原处，即出现错位情况。 　　解决思路： 解决光标错位：弹出层设置为posi...
在iOS中去掉input的光标
weixin_39205240的博客
06-20 2987
在input上添加readonly unselectable="on" onfocus="this.blur()"<input type="text" readonly unselectable="on" onfocus="this.blur()" value="点我啊"/>这样就正常了。
HTML在IOS上的点击焦点错乱
yeshen.org
08-11 2294
最近在写一个工单列表，点击加载更多的时候，在IOS上会打开附近的一个item，然后打开item就跳页，就跳页了。 很困扰，一开始以为是tap 和 a 的问题，把加载更多的高度提高也是无济于事，在android和chrome上也没有这个问题。 中午突然想起以前也有遇到过这个问题，解决的方法是补充一个height eg：#que-coop li{height: 72px;} 补
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

光光-Leo

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值