苹果手机在微信QQ上输入,导致页面事件触点错乱。

部分苹果手机在微信QQ上,输入之后,如果页面有滚动内容。内容上有对应的时间,那么输入结束,再次触发事件,会发现事件的触点变了。

例如:按钮A 因为 输入法弹出移动了,输入法隐藏回去后,按钮A 回滚到原来的位置,但是事件却已经不在按钮A上了。

对此的方式可以采用,重置页面  scrollTop ,

  // 重置苹果手机部分机型输入法导致页面滚动后,事件触点错位问题
        $(document).on(‘blur‘, ‘input,textarea‘, function () { //解决iPhoneX系列输入法导致页面事件不回滚问题
            setTimeout(function() {
            $(‘body,html‘).scrollTop($(document).scrollTop());
            }, 0);
        })

原文地址:https://www.cnblogs.com/wxhhts/p/12096018.html

时间: 2024-11-06 03:43:25

苹果手机在微信QQ上输入,导致页面事件触点错乱。的相关文章

PC上对限制在微信客户端访问的html页面进行调试

PC上对微信的html5页面做测试,一般来说需要两个条件:浏览器UA改为微信客户端的UA(打开页面提示请在微信客户端登录就需要修改UA):增加满足html5验证条件的Cookie来进行微信OAUTH验证 说明: 单纯的调试可以安装微信web开发者工具,使用微信进行登录来进行调试.这个工具有类似chrome的调试工具,但是这个不能装插件的.所以如果想用yslow等插件进行页面性能测试.还是要在chrome.Firefox等浏览器里实现模拟微信的html5页面 一.将浏览器的UA(user-Agen

微信sdk分享,苹果手机分享到qq好友和qq空间没有反应

最近线上程序苹果手机进行微信分享时,分享到qq好友和qq空间,无法调用分享程序,从微信跳转到qq后就没有反应了,但是安卓手机分享就没事? 解决:调用微信sdk分享时,分享的url(link)的参数不能带有中文,带有中文就会分享无效,造成分享到qq好友和qq空间没有半点反应,所以分享的url中参数有中文的最好进行处理一下,不然的话在苹果机器上面会有问题

苹果手机QQ上接收并下载的CAD图纸如何进行打开查看?

苹果手机QQ上接收并下载的CAD图纸如何进行打开查看?之前小编教大家了微信上面接收的CAD图纸应该如何打开查看的全部操作步骤,那么QQ上接收到的CAD图纸文件应该如何进行打开查看呢?不用着急,今天小编就要来教大家的就是QQ上接收并下载的CAD图纸如何进行打开的全部操作步骤,希望大家能够进行采纳,帮助到大家哦! 第一步:首先您的手机上面应该要有一款好用的CAD看图软件,小编使用的就是这款"迅捷CAD看图"软件,如果您们手机上没有一款CAD看图软件的话,你就可以去到软件商店上面进行查找下载

SharePanel – Android上简单的一键分享,可分享到微信QQ和新浪微博

SharePanel – Android上简单的一键分享,可分享到微信QQ和新浪微博 SharePanel Android上简单的一键分享可分享到微信QQ和新浪微博 简介 效果图 代码块 简介 最近在写一个小程序长微博工具,效果就是编辑长微博,然后一键分享到微信.QQ和新浪微博. 一开始是想直接用Intent.createChooser(target, title)来做,后来一想,这样做不是很好啊,会有许多乱七八糟的应用弹出来,我想优先分享到微信.QQ和微博,于是找了点资料,将一键分享这个部分做

微信小程序页面事件-下拉刷新,上拉加载更多

1.下拉刷新的概念及应用场景. 概念: 下拉刷新是移动端更新列表数据的交互行为,用户通过手指在屏幕上子上而下的滑动,可以触发页面的下拉刷新,更新列表数据. 应用场景: 在移动端,数据列表是常见的页面效果,更新列表数据是最基本的页面需求,相比于按钮刷新,定时刷新来说,下拉刷新的用户体验方便友好,已经成为移动端刷新列表数据的最佳解决方案. 微信小程序启动下拉刷新: 两种方式: 1.需要在app.json 的window选项中或页面配置中开启enablePullDownRefresh, 但是,一般情况

JS获取上一访问页面URL地址document.referrer实践2

一.JS获取前一个访问页面的URL地址document.referrer 要获取前一个访问页面的URL地址前后端语言都可以,例如PHP的是$_SERVER['HTTP_REFERER'],JavaScript的就是document.referrer. 我们平常开发,虽然和URL打交道也算比较频繁,但是,似乎很少使用document.referrer.我起初以为是兼容性不好,后来测试发现ie7都支持,那就奇怪了,为何document.referrer用的不多呢? 我想了一下,可能有下面几个原因:

移动端touch事件影响click事件以及在touchmove添加preventDefault导致页面无法滚动的解决方法

这两天自己在写一个手机网页,用到了触屏滑动的特效,就是往右滑动的时候左侧隐藏的菜单从左边划出来. 做完之后在手机原生浏览器中运行正常,但在QQ和微信中打开,发现touchmove只会触发一次,而且touchend也经常不触发. 之后百度了一下这个问题,原因是 主要是由于200ms超时导致内核不一定会一直处理touchmove事件,一旦超时会将后续所有的事件转交给UI处理,导致touchmove不会一直触发. 为了解决开发者需要,建议开发者在touchstart时调用event.preventDe

微信公众平台前端人员对接(微信拍照上传)

前言: 1.本篇主要介绍前端如何对接微信公众平台 2.示例选取微信拍照上传 3.微信JS-SDK说明文档 4.企业号开发者中心 5.请一定要确认自己的帐号类型是否拥有使用微信某项功能的权限,要不然方法回调不起作用 6.企业号对接功能检测图如下: 步骤: 1.确认设置安全域名(设置后,可在该域名下进行测试) 2.获取到AppID和AppSecret 3.通过AppID和AppSecret得到access_token a.请求方式get b.请求链接https://api.weixin.qq.com

微信,QQ这类IM app怎么做——谈谈Websocket

前言 关于我和WebSocket的缘:我从大二在计算机网络课上听老师讲过之后,第一次使用就到了毕业之后的第一份工作.直到最近换了工作,到了一家是含有IM社交聊天功能的app的时候,我觉得我现在可以谈谈我对WebSocket/Socket的一些看法了.要想做IM聊天app,就不得不理解WebSocket和Socket的原理了,听我一一道来. 目录 1.WebSocket使用场景 2.WebSocket诞生由来 3.谈谈WebSocket协议原理 4.WebSocket 和 Socket的区别与联系