IOS上给body和html绑定click事件的坑
场景: 在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事件的坑的更多相关文章
- [ 面试没回答上的问题2]IOS上给body绑定click事件的bug
面试被问到ios上的bug,自己提到绑定click事件的bug,但是并没有把问题讲的很清楚,这里再清理一下思路. 这个bug只在IOS上有,包括ihone,ipad,由于ios浏览器都用的safari ...
- vue 移动端在div上绑定click事件 失效
在.vue的文件中使用了better-scroll,在div标签上绑定click事件后,无效. 原因:使用了better-scroll,默认它会阻止touch事件.所以在配置中需要加上click: t ...
- ios 设备用jquery live绑定 click 事件不管用
问题描述:用js拼接的html追加到页面,然后用 live 绑定click事件不起作用 解决办法:1.直接在标签写onclick事件 2.给需要绑定的标签添加css样式{cursor:pointe ...
- jquery批量绑定click事件
jquery批量绑定click事件: var selects = $(".public_select dd ul li"); debugger; /*$(".public ...
- google跟踪代码管理器gtm无法给相同class元素绑定click事件埋点解决
Google 跟踪代码管理器是一个跟踪代码管理系统 (TMS),可以帮助您快速轻松地更新网站或移动应用上的跟踪代码及相关代码段(统称为“代码”).将一小段跟踪代码管理器代码添加到项目后,您可以通过网页 ...
- jQuery-介绍 加载 选择器 样式操作 属性操作 绑定click事件
jQuery - 介绍 加载 选择器 样式操作 属性操作 绑定click事件 注意:以下部分问题不能实现效果,因该是单词拼写错误(少个t)或者没有加引号(“swing”)... jquery介绍 jQ ...
- JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题
javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...
- jquery单选框radio绑定click事件实现和是否选中的方法
使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1. ...
- jquery单选框radio绑定click事件实现方法
本文实例讲述了jquery单选框radio绑定click事件实现方法.分享给大家供大家参考. 具体实现方法如下: 复制代码代码如下: <html><head><title ...
随机推荐
- 《深入理解Java虚拟机》读书笔记九
第十章 早期(编译期)优化 1.Javac的源码与调试 编译期的分类: 前端编译期:把*.java文件转换为*.class文件的过程.例如sun的javac.eclipseJDT中的增量编译器. JI ...
- python3 读取串口数据
python3 读取串口数据 demo import serial import time ser = serial.Serial("COM3",115200,timeout = ...
- AD转化器分类及特点和选用
1. AD转换器的分类 下面简要介绍常用的几种类型的基本原理及特点:积分型.逐次逼近型.并行比较型/串并行型.∑-Δ调制型.电容阵列逐次比较型及压频变换型. 1)积分型(如TLC7135)积分型AD工 ...
- hadoop中遇到的各种错误记录
hadoop中namenode无法启动 转载链接:https://blog.csdn.net/love666666shen/article/details/74350358 使用pi ...
- [NOIP2017(TG/PJ)] 真题选做
[NOIPTG2017] 小凯的疑惑 题意 小凯有两种面值的金币,每种金币有无数个,求在无法准确支付的物品中,最贵的价值是多少金币. 分析 设两种金币面值分别为 $a$ 和 $b \; (a<b ...
- Java-POJ1012-Joseph
打表啦 约瑟夫环,处理时下表统一为从0开始更方便! import java.util.Scanner; public class poj1012 { public static boolean cal ...
- 【Python】【爬虫】爬取酷狗音乐网络红歌榜
原理:我的上篇博客 import requests import time from bs4 import BeautifulSoup def get_html(url): ''' 获得 HTML ' ...
- 关于Dev-C++的安装以及基本使用方法
我觉得Dev-C++是一款小巧方便的编译器,就给那些刚刚学习编程的同学讲一下这个软件的安装和基本的编译以及一些使用的技巧. (完全是傻瓜式的截图和教程,内容过于冗余,主要是考虑到这些新生没有接触过编程 ...
- Chrome浏览器添加信任站点
转载来源:https://zhidao.baidu.com/question/1946829886340846268.html 在浏览器地址栏输入:chrome://net-internals/#hs ...
- 题解 P5587 【打字练习】
P5587 打字练习 想发一篇较为简洁易懂的题解,代码看起来长,实际上还是很好理解的,而且很多对称着写就行了 一道字符串签到题,比赛的时候小蒟蒻调了一个小时都没调出来一直RE,坑点还是不少的(主要是我 ...