H5 iOS 微信内核 自定义提交按钮点击后收起软键盘，无法触发点击事件（微信开发直播间踩坑记 二）

最新推荐文章于 2024-04-10 11:22:42 发布
最新推荐文章于 2024-04-10 11:22:42 发布
阅读量865 收藏 1
点赞数
分类专栏： 微信页面开发 JavaScript jQuery 文章标签： h5 iOS 微信 提交 无效
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/sanai_1992/article/details/100129166
版权

做直播间最下面有发言条，输入框和提交按钮，给提交按钮添加了点击事件，输入内容后点击提交，只是收起了软键盘。

本以为是优先触发了软键盘收起的事件，解决了好长时间，偶然发现，原因是绑定点击事件为click，改为touchend，完美解决了我的问题。

至此   仅记录

蕭朙偉
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
ios 上h5点击无效_ios h5 点击事件失效及点击延迟
weixin_33842051的博客
12-23 1632
1.ios h5 app avalon tap事件失效使用MUI制作app界面,使用avalon.js渲染数据,发现在(Android上正常)ios上运行时容器div的avalon的ms-on-tap被内容遮住不执行.用MUI的on tap事件可以执行但改动较大,于是改为ms-on-click.(但是click事件有300ms延迟,解决方法在标题2处),搜索到以下解决方法:解决办法有 4 种可供选...
解决IOS端微信H5页面软键盘弹起后页面下方留白的问题
12-11
前言：微信H5项目，ios端出现了软键盘输完隐藏后页面不会回弹，下方会有一大块留白 最近微信和ios都有版本升级，不知道是哪边升级造成的，但是经过测试，软键盘收起后，再滚动一下页面，下面的留白就会消失。所以...
H5-input弹起键盘遮盖输入框(Android)、键盘弹起后不恢复(IOS)
zhangxy的博客
12-13 3935
页面完成之后发现在Android上软键盘的弹起并不会像IOS一样带动页面的弹起，而是在原有位置遮盖了输入框，表现如下(有光标的input在弹起键盘时被遮住)： 解决： window.addEventListener('resize', () => { if (document.activeElement.tagName == 'INPUT') { ...
解决 taro 小程序软键盘升起时点击按钮会隐藏软键盘不触发按钮的点击事件
weixin_50236973的博客
05-19 322
【代码】解决 taro 小程序软键盘升起时点击按钮会隐藏软键盘不触发按钮的点击事件。
ios手机弹出软键盘后按钮失效
chaitong2204的博客
05-04 1061
直接在点击事件中加document.body.scrollTop = 0;
微信软键盘收起后 页面点击无效
我在等风也等你的博客
03-27 1464
h5项目中遇到iOS系统微信环境中软键盘 /** * 处理iOS 微信客户端6.7.4 键盘收起页面未下移bug */ ;(/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', (e) => { ...
iOS微信浏览器回退不刷新实例(监听浏览器回退事件)
01-03
iOS在微信浏览器回退是不重新加载页面的，有些时候是需要重新加载的，所以需要监听回退事件 $(function(){ pushHistory(); }); function pushHistory(){ window.addEventListener(popstate, function(e){ alert&...
ios微信浏览器返回不刷新问题完美解决方法
08-29
iOS 微信浏览器返回不刷新问题是指在 iOS 设备上使用微信浏览器时，用户点击返回按钮后，页面不刷新的问题。这种问题会导致用户体验差，影响应用程序的整体性能。 为什么会出现 iOS 微信浏览器返回不刷新问题？ ...
详解Vue开发微信H5微信分享签名失败问题解决方案
12-03
关于Vue中路由使用history模式，开发微信H5页面分享时在安卓上签名有效成功，但是在IOS设备上一直报错签名失效问题 问题描述:在Vue开发过程中，路由使用History模式下，在使用微信分享时，在微信开发者工具上一切...
h5 ios微信浏览器 input获取焦点后，收起软键盘，光标错位
weixin_30699443的博客
05-07 604
整个页面布局如下: 外层设置fixed的原因是不让页面在浏览器中进行上下拖拽, 最后形成的结果是：输入框获取焦点输入内容后，光标错位，导致不能选中输入框重新获取焦点（页面上移，但是布局未产生影响）; 解决 改变页面布局: 外层fixed取消,改用 display:flex布局，将内容分为3部分，中间内容flex-grow: 1; 好了 给input设置fixed或者...
IOS虚拟键盘弹出后，弹窗的按钮点击不起作用，不会触发click事件
最新发布
weixin_43760969的博客
04-10 774
IOS虚拟键盘弹出后，弹窗的按钮点击不起作用，不会触发click事件
ios 最新系统bug与解决——微信公众号中弹出键盘再收起时，原虚拟键盘位点击事件无效...
weixin_34327761的博客
12-06 1160
最近ios发布新版本系统12.1，随着部分用户的系统更新，一些问题也渐渐暴露出来。。。 公司用户反映微信公众号出现了点击无效的bug！！测试调查发现，只有iphonex、iphone6，ihpone7等部分机型会出现该问题 我当时就是一惊，一般出现在事件上的问题都是疑难杂症。何况是跟键盘相关的。 我们都知道在H5端是没法监控键盘的弹出与收起的，resize事件触发的机型极其有限，何况我在ios中实...
解决ios微信内置浏览器触发事件有问题方案
weixin_33881140的博客
11-26 1290
你的问题原因是事件冒泡导致找不到或者找到多个事件导致的， 你这样去写！ $(“#div1").on("click",".k1",function(){ alert(11); }) 不要用： $(document).on("click","#div1 > .k1",function(){ alert(11); ...
click事件无法触发解决方案
听闻青春丶
05-31 3615
方法： 这里使用了jq所以直接用了，大家可以改成原生写法 /** * 将touch事件改为点击事件 * @param {[string]} dom [css选择器] * @param {[bool]} derect [方向 x为false,y方向为true] * @param {Function} callback [要执行的函数] * @retur...
IOS微信浏览器内H5页面点击事件失效
helloschurmi的博客
08-08 6142
在微信浏览器内的H5页面，当触发点击事件时有时会失效，点击没有效果，或者点击事件错位，其实这是因为在小屏幕上，在点击输入框弹出键盘 键盘回缩 后定位没有相应改变 也就是说，其实是input聚焦后页面被顶起，然后失焦后页面回位，但是这里只是视觉上回位了，window其实已经被顶上去一定的距离。你再次点击页面时就已经错位了，视觉上的点击事件触发按钮其实不是真正的按钮位置，所以点击时不会生效，而是在...
总结：苹果系统H5页面软键盘弹出造成点击事件失效
apoju0424的博客
07-30 2308
问题描述：苹果系统，软键盘弹出，键盘再收起时，原虚拟键盘位点击事件无效。 排查过程：只有iphonex、iphone6，ihpone7等部分机型会出现该问题； 原因：在IOS下，点击页面中的input时，弹出软键盘时，如果input比较靠下，整个页面会上移，document.body.scrollOffset会由0变成大于0。 软键盘消失后，页面会下移。但是document.body...
vue h5 ios点击屏幕不收起键盘
shiyutim
11-29 2822
vue h5 ios点击屏幕不收起键盘 在安卓下，点击屏幕能够正常的收起键盘，但是在ios下，点击屏幕是不会收起键盘的，那么就需要手动让他收起键盘。 在网上查找一番后，看到一篇文章：https://www.cnblogs.com/binmengxue/p/5993166.html。受这篇文章的启发，我改良成vue版。 原理就是： 在ios下，键盘弹出，然后点击屏幕空白，键盘不会收起，其实就是in...
如何处理微信7.0中，ios下软键盘弹出后，点击完成不收起的bug
weixin_43048195的博客
02-26 944
最近做项目发现在iOS12.*系统里的微信7.0版本下，input输入框会产生个很怪的bug：软键盘弹出后，点击完成后键盘并没有收起。 该bug在iOS自带的Safari浏览器里面是没有任何问题的，于是找度娘狂搜了一番 ...
uniapp h5微信浏览器点击按钮分享好友
12-27
以下是在uniapp h5微信浏览器中点击按钮分享给好友的方法： 1. 首先，在你的uniapp项目中，你需要使用uniapp提供的分享API来实现分享功能。你可以在按钮的点击事件中调用该API。 2. 在按钮的点击事件中，调用uni....
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值