场景: 在ios上(包括iPhone和ipad)

   给window ,html,document,body绑定click事件,点击不会触发

   由于ios浏览器都用的safari内核,所以ios浏览器全部中枪

解决方案:

  • 改用touch事件(如果是弹出层的话,会有点透问题)
  • 如何避免bug触发:不要委托到body结点上,委托到任意指定父元素都可以,或者使用原生具有该事件的元素,如使用click事件触发就用a标签包一层。
  • 已触发如何修补:safari对事件的解析非常特殊,如果一个事件曾经被响应过,则会一直冒泡(捕获)到根结点,所以对于已大规模触发的情况,只需要在body元素的所有子元素绑定一个空事件就好了,如: (“body > *”).on(“click”, function(){};)

IOS上给body和html绑定click事件的坑的更多相关文章

  1. [ 面试没回答上的问题2]IOS上给body绑定click事件的bug

    面试被问到ios上的bug,自己提到绑定click事件的bug,但是并没有把问题讲的很清楚,这里再清理一下思路. 这个bug只在IOS上有,包括ihone,ipad,由于ios浏览器都用的safari ...

  2. vue 移动端在div上绑定click事件 失效

    在.vue的文件中使用了better-scroll,在div标签上绑定click事件后,无效. 原因:使用了better-scroll,默认它会阻止touch事件.所以在配置中需要加上click: t ...

  3. ios 设备用jquery live绑定 click 事件不管用

    问题描述:用js拼接的html追加到页面,然后用 live 绑定click事件不起作用 解决办法:1.直接在标签写onclick事件   2.给需要绑定的标签添加css样式{cursor:pointe ...

  4. jquery批量绑定click事件

    jquery批量绑定click事件: var selects = $(".public_select dd ul li"); debugger; /*$(".public ...

  5. google跟踪代码管理器gtm无法给相同class元素绑定click事件埋点解决

    Google 跟踪代码管理器是一个跟踪代码管理系统 (TMS),可以帮助您快速轻松地更新网站或移动应用上的跟踪代码及相关代码段(统称为“代码”).将一小段跟踪代码管理器代码添加到项目后,您可以通过网页 ...

  6. jQuery-介绍 加载 选择器 样式操作 属性操作 绑定click事件

    jQuery - 介绍 加载 选择器 样式操作 属性操作 绑定click事件 注意:以下部分问题不能实现效果,因该是单词拼写错误(少个t)或者没有加引号(“swing”)... jquery介绍 jQ ...

  7. JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题

    javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...

  8. jquery单选框radio绑定click事件实现和是否选中的方法

    使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1. ...

  9. jquery单选框radio绑定click事件实现方法

    本文实例讲述了jquery单选框radio绑定click事件实现方法.分享给大家供大家参考. 具体实现方法如下: 复制代码代码如下: <html><head><title ...

随机推荐

  1. jQuery---入口函数的写法

    入口函数的写法 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset=&quo ...

  2. 2019-08-09 纪中NOIP模拟B组

    T1 [JZOJ1035] 粉刷匠 题目描述 windy有N条木板需要被粉刷. 每条木板被分为M个格子. 每个格子要被刷成红色或蓝色. windy每次粉刷,只能选择一条木板上一段连续的格子,然后涂上一 ...

  3. 解决前端js、css缓存问题

    去js标签库查询jquery.i18n.properties.js这个js引用到页面上: 新建一个配置文件:用上面的那个js方法调取配置文件里的版本号给其他的js加上: 示例: <script ...

  4. 《TCP/IP入门经典》摘录--Part 1

    TCP/IP基础知识 什么是TCP/IP Transmission Control Protocol/Internet Protocol的简写,中译名为传输控制协议/因特网互联协议,又名网络通讯协议, ...

  5. DFT测试-OCC电路介绍

    https://www.jianshu.com/p/f7a2bcaefb2e SCAN技术,也就是ATPG技术-- 测试std-logic, 主要实现工具是: 产生ATPG使用Mentor的 Test ...

  6. 解决 genymotion 安装apk报错 app contains ARM native code and your Genymotion device cannot run ARM instructions

    1.某些APP安装在模拟器时提示“ this probably means that the app contains ARM native code and your Genymotion devi ...

  7. 剑指offer 面试题. 数据流中的中位数

    题目描述 如何得到一个数据流中的中位数?如果从数据流中读出奇数个数值,那么中位数就是所有数值排序之后位于中间的数值.如果从数据流中读出偶数个数值,那么中位数就是所有数值排序之后中间两个数的平均值.我们 ...

  8. Python_包

    包 包是一种通过使用‘.模块名’来组织python模块名称空间的方式. 1. 无论是import形式还是from...import形式,凡是在导入语句中(而不是在使用时)遇到带点的,都要第一时间提高警 ...

  9. JVM的前世今生

    前世 jvm的数据区 分别是方法区(Method Area),Java栈(Java stack),本地方法栈(Native Method Stack),堆(Heap),程序计数器(Program Co ...

  10. 概念理解_L2范数(欧几里得范数)

    L1范数 L1范数是指向量中各个元素绝对值之和 L2范数 L2范数.欧几里得范数一些概念. 首先,明确一点,常用到的几个概念,含义相同. 欧几里得范数(Euclidean norm) ==欧式长度 = ...