IOSSafari与微信浏览器中点击事件失效的解决办法? --已解决！-前端-E先生的博客

大语言模型

IOSSafari与微信浏览器中点击事件失效的解决办法? --已解决！

admin • 2020-07-21 01:58:37 • 前端 • 阅读873

[导读]：使用当委托给一个元素添加click事件时，如果的英文事件委托到document或body上，并且委托的元素是默认不可点击的（如div，span等），此时click事件会失效。可以使用下面的代码在iOS中进行测试。...

使用当委托给一个元素添加click事件时，如果的英文事件委托到document或body上，并且委托的元素是默认不可点击的（如div，span等），此时click事件会失效。

可以使用下面的代码在iOS中进行测试。

iOS click bug test

Click Me!

解决办法

解决办法有4种可供选择：

将click事件直接绑定到目标元素（即.target）上

目标将换成元素或者button等柯林斯点击的元素

将click事件委托到非document或body的父级元素上

给目标元素加一条样式规则 cursor: pointer;

推荐后两种。从解决办法来看，推测在safari中，不可点击的元素的点击事件不会冒泡到父级元素。通过添加cursor: pointer使得元素变成了可点击的了。

问题：

$(document).on("click",".btn",function(){alert("1")});

在微信浏览器上点击不起作用，而在其他设备均没问题。

解决办法：

在点击事件前面加入这个代码启用点击事件。

// IOS 微信浏览器开启点击事件
$("body>*").bind("click",function(){});

IOS微信浏览器的window、document、body并不接受click事件，按钮和链接才接受click事件。

本文来自E先生的博客，如若转载，请注明出处：https://javajz.cn

IOSSafari,与,微信,浏览器,中,点击,事件,失效,

打赏

微信扫一扫

admin

Vuex 是什么？什么是“状态管理模式”？什么情况下我应该使用 Vuex？

« 上一篇

javascript:void(0)的含义 --已解决！

下一篇 »

留言区

历史留言

欢迎加Easy的QQ