iOS app内嵌H5页面，点击js onclick无效

最新推荐文章于 2024-08-07 15:04:54 发布
最新推荐文章于 2024-08-07 15:04:54 发布
阅读量1.9k 收藏
点赞数
分类专栏： JS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41581254/article/details/103387400
版权

打了各种log，各种样式调试，最后发现js onclick点击效果无效，查看手机版本发现是9.3.5，很低，如果点击的模块不是a标签或者button，需要给他加上cursor: pointer的样式

葵妹子
关注
专栏目录
ios 上h5点击无效_ios h5 点击事件失效及点击延迟
weixin_33842051的博客
12-23 1707
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 种可供选...
解决 | H5页面调用手机相机相册，安卓正常，但ios没办法选择相册
溪溪酱的博客
12-03 2756
H5页面调用手机相机相册，安卓正常，但ios没办法选择相册 <div onclick="javascript:$('#addPhoto').click();"></div> <input type="file" accept="image/*" capture="camera" id="addPhoto" style="display: none;" @change="addPhoto()"> $(function () { //获取浏览器的userAgent,
h5点击事件在ios上无效的问题
江湖的博客
03-20 3125
为<span></span>绑定了click事件，嵌入ios app后点击无效 解决方式：为span 添加css样式解决，元素变成了可点击的了 cursor: pointer;
IOS使用WebView内嵌H5页面，使用a标签点击跳转无效问题解决
lizhi1030的博客
08-07 638
在使用WKWebView加载H5时，给文字添加超链接，使其可以点击跳转到某个地址。发现在 IOS 的app内，a标签点击跳转没有作用，无法跳转到正确地址，decidePolicyForNavigationAction也无法抓取到点击事件。但安卓是可以正常跳转。iOS的用户长按链接也是可以打开链接的，不过是打开了个菜单，可以跳转到了浏览器。WKWebView 加载完链接后点击内部链接无法跳转，是因为中的是打开新的页面，所以无法在当前页面打开，需要在当前页重新加载url。
H5绑定的click事件在ios上失效的问题
linfng023的博客
08-20 2135
绑定的click事件在ios上失效的问题 项目中遇到的问题,在H5做下拉菜单时,需要在点击空白处就隐藏菜单,于是就给document绑定了click事件 但是绑定的事件却只能在pc端和android上才能生效使用,在ios上就失效了,在网上搜索了此类的问题,大概就是ios系统上,document,body或div这些元素默认是没有点击事件,所以当把click事件委托给这些元素时,在ios上就会失...
vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟，连续点击无反应的问题...
weixin_30807779的博客
06-01 402
异常描述： 　　ios系统手机中访问h5页面，按钮点击有延迟，连续点击卡顿、无反应。 异常原因： 　　这要追溯至 2007 年初。苹果公司在发布首款 iPhone 前夕，遇到一个问题：当时的网站都是为大屏幕设备所设计的。于是苹果的工程师们做了一些约定，应对 iPhone 这种小屏幕浏览桌面端站点的问题。这当中最出名的，当属双击缩放(double tap to zoom)，这也是会有上述 30...
android加载H5界面部分按钮不能触发点击事件及展示不全问题
kongT。的博客
09-18 6841
最近遇到部分H5界面部分不能点击及有些展示出来的H5界面不全，通过客服反馈过来的问题，大部分都是android4.0以上，android6.0以下的系统出的问题，而6.0以上的手机都正常，这是因为前端H5部分代码不支持手机低版本，那么App端就应该想办法去解决这个问题。 网上说这个原因是：没有启动webview的html5的本地存储功能（不使用HTML5 DOM存储，不会主动加载到Android...
js点击事件在ios中失效的解决方案
deathstrider的博客
09-27 3498
ios中不允许将点击事件绑定在document或者body上，如果绑定上的话将会失效。解决方案： 例如： $(document).on(‘click’, ‘#content’, function ()}… //无效 第一种： 改为： 用#content外面的标签，但不要是 docuemnt或者body $(‘任意的#content的父元素’).on(‘click’, ‘#content’, fu...
H5按钮唤起APP应用（IOS）或跳转至APPstore
热门推荐
weixin_34304013的博客
06-18 1万+
昨天刚到公司收到了内部邮件，让调研是否可以由H5页面直接唤起APP。因为之前搞过这个东西，所以直接回复可以唤起，但是与前端联调时，遇到了种种的坎，所以今天特此记录一下，方便以后使用。 首先H5唤起APP，需要在H5和APP中进行不同的设置。 原理说明 首先需要说明，不管iOS还是Android，浏览器都不可能预知本地是否安装了某个APP的。或者更严谨地说，我们不能通过浏览器来预知本地...
小程序web-view加载H5页面，调用手机APP地图导航
semoon的博客
09-09 5454
小程序web-view加载H5页面，调用手机APP地图导航 1.需求 业务背景：微信小程序中要使用H5页面做卡券广场，为什么不用原生的小程序做？因为要尽可能实现多端复用，这款产品已经在研发APP。好了，我们说业务，卡券列表主要是以店铺为模块展示，商家名称、商家地址、产品图、产品介绍，卡券（券值、抵扣门槛、有效期、卡券状态、购买按钮等信息），用户点击商家位置可以调用小程序地图，查看线路推荐能调用手机...
微信h5页面跳转浏览器 在微信中点击链接直接跳转到手机默认浏览器代码实现...
dkag11478的博客
02-15 950
由于微信的限制，应用文件在内置浏览器中下载全部被屏蔽掉，造成很多人用微信扫描二维码下载时点击下载按钮没反应，我想到的是做一个提示用户在浏览器中打开下载。 之前写过的两篇文章：微信打开网址添加在浏览器中打开提示和微信扫描打开APP下载链接提示代码优化，尽管已经做得很简单，但发现很多问这类问题的都是小白。 其实原来很简单，就是判断当前是在微信内置浏览器中，然后将默认隐藏的提示层显示出...
解决ios中的onclick失效的问题
Clara_G的博客
02-28 3237
前段时间笔者跟同事一起开发移动端H5界面,后来在测试时,发现一些界面的onclick事件在苹果ios上不管用,因为笔者跟同事之前一直做PC端开发,不太清楚怎么回事,于是在网上找到如下几种方案: 一.修改css方法 将绑定事件的span元素添加 z-index 跟cursor:pointer,这个没管用 二.修改onclick的绑定 直接把onclick事件换成 $('span').on...
APP端webview嵌套h5页面，h5的返回按钮点击没有效果？
PrimaryColor
08-29 3169
比如第三方客服，在h5页面中提供了返回按钮，而在app端并没有提供返回按钮，让用户用物理返回键返回。关于app端嵌套h5的页面，
APP中内嵌H5页面为什么不能下载？
weixin_34344677的博客
11-09 3942
在APP中内嵌H5页面，若页面上存在下载链接，没有任何反应，为什么呢？ 原因是app中内嵌的H5页面是WebView解析的，什么是WebView呢？ 在Android手机中内置了一款高性能webkit内核浏览器，在SDK中封装为一个叫做WebView组件。 WebView控制调用相应的WEB页面进行展示。当碰到页面有下载链接的时候，点击上去是一点反应都没有的。原来是因为WebView默认没有开启文...
h5集成到IOS后，文件下载功能无效问题！
iamTab的博客
11-10 5759
公司新开发的app，测试妹纸反馈苹果版文件下载功能点击没任何反应。检查安卓版后，是正常的。于是检查了一下代码如下： //下载文件 function downLoadFile(filePid,tableName) { window.open("viewFile.aspx?filePid=" + filePid + "&tableName="+tableName); } 轻松定位问题（就一行代码，嘿嘿 - -！！） 经过调查发现： 问题原因：大部分现代的浏览器（Chrome/Firefo..
APP 内嵌H5, H5遇到的 兼容性问题
szjSmiling的博客
11-21 1868
H5, 遇到的 ios 兼容性问题 因为需求需要 APP内嵌H5页面 , 所以在开发测试过程中,发现了一下兼容性问题, 都已解决,不好的地方还请指出. 希望对大家有所帮助! 1.ios 中日期格式 new Date('2019-10-11') 无效; 解决: new Date('2019-10-11'.replace(/\-/g, '/')); 2.ios 中日期格式 new Date('...
iOS端点击H5页面的a链接无反应
6块腹肌的博客
02-26 3372
iOS端点击H5页面的a链接无反应，一般这种问题发生在新窗口打开的情况下，也就是说target的值为 _blank 时会发生这个问题，改为 _self 即可解决问题。或者iOS的用户长按链接也是可以打开链接的。 ...
iOS端内嵌H5页面 点击a标签无反应
joe0235的博客
01-28 4445
问题1： iOS端内嵌H5页面，点击a链接无反应 解决： 一般这种问题发生在新窗口打开的情况下，也就是说 target 的值为 _blank 时会发生这个问题，改为 _self即可解决问题。或者iOS的用户长按链接也是可以打开链接的，不过是跳转到了浏览器。 问题2： 如果点击的模块不是a标签或者button 解决： 需要给他加上cursor: pointer的样式。 第二种解决方案是将click事件替换为touchstart事件，或者click事件与touchstart事件并存： $(document
IOS使用WebView内嵌H5页面,无法触发H5页面的点击事件
最新发布
09-25
在iOS中，当你使用WKWebView（WebKit框架的一部分，用于渲染HTML内容）嵌入H5页面时，有时可能会遇到点击事件无法触发的问题。这通常可能是由于以下几个原因： 1. **WKWebView设置**：确保WKWebView的交互代理（WKNavigationDelegate）已启用并且设置了正确的用户交互处理。需要确保`webView.scrollView.isScrollEnabled = false`以防止滚动遮挡点击。 ```swift let webViewConfiguration = WKWebViewConfiguration() webViewConfiguration.userContentController.add(self, name: "webPageInteractions") ``` 然后在代理方法中处理点击： ```swift func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) { if message.name == "webPageInteractions" { handleWKMessage(message.body as! String) } } func handleWKMessage(_ message: Any) { // 处理H5页面传递过来的点击事件 } ``` 2. **JS桥**：如果H5页面使用了JavaScriptBridge（如JSCore、WebViewJavascriptBridge等）来发送消息，确保桥梁已经配置并能正确地将点击事件转发给Swift。 3. **CSS穿透**：检查页面是否有阻止元素获取焦点的样式（比如`pointer-events: none;`），这可能导致点击失效。修复这类问题可能需要调整H5页面的样式。 4. **跨域限制**：如果H5页面位于不同的域下，可能存在同源策略限制点击事件的传播。确保通过CORS或服务端设置允许相应的请求来源。 5. **调试工具**：检查开发者工具中的网络请求，确认H5页面是否正确地发送了交互事件，并查看日志以找出问题。 如果你遇到这个问题，可以尝试排查以上几个方面，若仍有疑问，可以考虑提供具体的代码片段以便更好地定位问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值