jQuery的on绑定事件在mobile safari(iphone / ipad / ipod)上无法使用的解决方案
用一个div当做了一个按钮来使用。
<div class="button">
<div class=" next_button button_left btn_red" style="width: 345px;">
下一步
</div>
</div>
因为是动态添加的内容,所以想要使用click事件,需要给他用on绑定一下:
$(document).on("click",".next_button",function(){
alert();
});
这个时候,使用苹果手机访问的时候,发现了一个坑爹的问题,如论如何点击“下一步”,都没有任何反应,可是在安卓和各种模拟器中一切正常。后来经过查找资料才知道,苹果有这么个设置:
对于点击的对象,拥有cursor:pointer这个样式的设置,也就是说,鼠标放上去,能够出现“手”型的图标才被认作可以使用点击事件,于是果断增加了样式
<style>
.next_button{
cursor:pointer
}
</style>
原因:
问题出在,你要给你的dom写一个css样式 cursor:pointer
因为safari认为这才是一个可点击区域,这样表达更加友好,才会让你可以click,你才可以点击,你才可以绑定。
又或则你是一个<a>标签,然后<a>标签里面只有是<img>标签,你的<a>标签用on绑定click事件也是可以的,其他的标签都被无视click了。
又或则你用tap事件,又或则你直接仿写click,摁下超过300毫秒再触发都是可以的。
希望我的答案可以帮助到其他开发web移动端的小伙伴
作者:bo Bo
链接:https://www.zhihu.com/question/23689377/answer/48964971
来源:知乎
著作权归作者所有,转载请联系作者获得授权。
jQuery的on绑定事件在mobile safari(iphone / ipad / ipod)上无法使用的解决方案的更多相关文章
- jQuery的live绑定事件在mobile safari(iphone / ipad / ipod)上失效的解决方案
jQuery的live绑定为什么会在mobile safari上失效呢?其实可以追溯到jQuery里live的实现方式.live的实现方式实际上是通过事件委托机制来实现的,也就是说是通过诸如冒泡的方式 ...
- 2017年3月25日工作日志:Jquery使用小结[绑定事件判断、select标签、军官证正则]
jQuery获取DOM绑定事件 在1.8.0版本之前,我们要想获取某个DOM绑定的事件处理程序可以这样: $.data(domObj,'events');//或者$('selector').data( ...
- 关于Jquery的delegate绑定事件无效
今天在做一个页面,用的是easyui页面有很多的tabs,里面都放了iframe 需要在load事件动态调整iframe高度 发现始终无法使用delegate来绑定load事件. 纠结了一下午发现了问 ...
- jquery-10 jquery中的绑定事件和解绑事件的方法是什么
jquery-10 jquery中的绑定事件和解绑事件的方法是什么 一.总结 一句话总结:bind(); unbind(); one(); 1. jquery中的绑定事件和解绑事件的方法是什么? bi ...
- jQuery添加html绑定事件
jQuery添加html绑定事件 $("#xxx").on("click",".dev",function(){ });
- [原创]解决jQuery.live在mobile safari(iphone / ipad / ipod)绑定失败的问题
解决方案: 给要使用live绑定事件的元素,添加“cursor:pointer”样式即可! 如: a,input,td{cursor:pointer;} 原文链接:http://bugs.jquery ...
- 解决jQuery.live在mobile safari(iphone / ipad / ipod)绑定失败的问题
解决方案: 给要使用live绑定事件的元素,添加“cursor:pointer”样式即可! 如: a,input,td{cursor:pointer;}
- jquery中on绑定事件
之前项目中动态创建的标签元素 在绑定事件的时候 都是无效 无论如何都不能触发 eg:在页面加载完成之后 再由脚本动态创建的<div>元素 在绑定事件的时候 例如click事件 ...
- jquery之on()绑定事件和off()解除绑定事件
off()函数用于移除元素上绑定的一个或多个事件的事件处理函数. off()函数主要用于解除由on()函数绑定的事件处理函数. 该函数属于jQuery对象(实例). 语法 jQuery 1.7 新增该 ...
随机推荐
- Cherry.chen window.clipboardData实现剪切板操作总结 (好像只有ie好用)
window.clipboardData的作用是在页面上将需要的东西复制到剪贴板上,提供了对于预定义的剪贴板格式的访问,以便在编辑操作中使用. 三个方法 (1)clearData(sDataForma ...
- java split(regex,limit) 使用记录
1.split(“,”,0):是切割默认模式等同于split(",")结尾符合分割字符为空不进行进行分割,如图: 2.split(",",-1):limit参数 ...
- 训练赛-Move Between Numbers
题意:给你n个数,每个数有20个数字,每两个数字之间如果相等的数字数量为17个(一定是17),就能从一个数字到达另一个数字,给你两个数字编号,求从第一个数字编号到第二个数字编号之间最少需要走几次: 解 ...
- 【嵌入式】Arduino编程基础到应用全解析
Arduino Author: Andrew.Du 基础 基础语法: setup() loop() pinMode(引脚,模式) pinMode(13,OUTPUT):设置13号引脚为输出 //在使用 ...
- ScheduledThreadPoolExecutor 吞异常
线程挂掉不一定会输出日志到控制台,比如ScheduledThreadPoolExecutor,如果在执行的任务中有未捕获的异常抛出,就行停止调度,没有任何错误输出到控制台或日志文件.在项目中这会导致一 ...
- 自定义Wed框架
Wed框架本质 我们可以这样理解:所有的Web应用本质上就是一个socket服务端,而用户的浏览器就是一个socket客户端. 这样我们就可以自己实现Web框架了. 半成品自定义wed框架 impor ...
- BZOJ 1977 严格次小生成树(算竞进阶习题)
树上倍增+kruskal 要找严格次小生成树,肯定先要找到最小生成树. 我们先把最小生成树的边找出来建树,然后依次枚举非树边,容易想到一种方式: 对于每条非树边(u,v),他会与树上的两个点构成环,我 ...
- Mybatis Generator的model生成中文注释,支持oracle和mysql(通过修改源码的方式来实现)
在看本篇之前,最好先看一下上一篇通过实现CommentGenerator接口的方法来实现中文注释的例子,因为很多操作和上一篇基本是一致的,所以本篇可能不那么详细. 首先说一下上篇通过实现Comment ...
- 定位现网环境中最耗费CPU的Java线程
参考:JVM性能调优监控工具jps.jstack.jmap.jhat.jstat.hprof使用详解 下面通过一个实例找出某个Java进程中最耗费CPU的Java线程并定位堆栈信息,用到的命令有ps. ...
- 【BZOJ5291】[BJOI2018]链上二次求和(线段树)
[BZOJ5291][BJOI2018]链上二次求和(线段树) 题面 BZOJ 洛谷 题解 考虑一次询问\([l,r]\)的答案.其中\(S\)表示前缀和 \(\displaystyle \sum_{ ...