IOS下自定义click事件使用alert引发的血案
使用过iscroll插件的同学都知道iscroll支持自定义事件,即在调用iscroll时参数赋值options.click = true。
接下来定义事件如:
$clinicAppoint.on('click', function(event) {
if($(event.target).closest('#clinic-select').size() > 0 ) {
alert($(event.target).closest('#clinic-select')[0].id);
}else if($(event.target).closest('#appoint-time').size() >0) {
alert($(event.target).closest('#appoint-time')[0].id);
}
});
安卓和pc端模拟显示正常,在IOS上会点击id="clinic-select"的元素及其子元素时,alert正常,接着点击id="appoint-time"的元素及其子元素时,诡异的现象出现了:
居然alert出"clinic-select",接着第二次点击id="appoint-time"的元素及其子元素时,alert又正常了。再点击id="clinic-select"的元素及其子元素时,alert又不正常了。去掉 alert,一切又正常了,看来这是alert的问题。
IOS最终问题的根源:
在没有alert的情况的下,每次点击事件的顺序都是那么的和谐:touchstart->touchend; touchstart->touchend。
如果有alert,就影响了这个和谐的事件,事件是这样的:
第一次点击:touchstart->touchend->touchstart
第二次点击:touchend->touchstart->touchcancel
第三次点击:touchstart->touchend->touchstart
第四次点击:touchend->touchstart->touchcancel
这不和谐不要紧,要命是第一次点击最后的touchstart和第二次点击touchend事件是一个整体,被alert强制破坏了,
导致第二次点击事件总是第一次绑定的事件。直到第三次点击回到正常,第四次点击又郁闷了。。。。。解决办法:
纠正alert引起的事件顺序错乱,让它们回到正常顺序,即:
第一次点击:touchstart->touchend
第二次点击:touchstart->touchend
。。。。。
setTimeout(function(){
alert($(event.target).closest('#appoint-time')[0].id);
},0);
在alert之前先让浏览器UI进程按照顺序执行alert。就可以让事件回到正常顺序,即:
第一次点击:touchstart->touchend
第二次点击:touchstart->touchend
。。。。。
血的教训:不要用alert。
IOS下自定义click事件使用alert引发的血案的更多相关文章
- ios下按钮click事件点击穿透问题
和app进行混合开发的时候,一个页面使用h5写的,按钮上绑定click事件会触发下面图片上的a链接导致跳转,页面如图 顶部是一个banner,分vr.视频.图片三部分,红框处的三个nav按钮绑定cli ...
- IOS下的 click 点击失效
当委托给一个元素添加click事件时,如果事件是委托到 document 或 body 上,并且委托的元素是默认不可点击的(如 div, span 等),此时 click 事件会失效. demo: & ...
- ios微信浏览器click事件不起作用的解决方法
$(document).on( "click", ".weui_cell", function (event) {alert(); }); JS代码是这样的,h ...
- jquery 自定义click事件执行多次
用jquery绑定一个按钮click事件后,第一次点击后一切正常,第二次点击竟然执行两次,以后越来越多, 后来查看文档发现 jquery click 不是替换原有的function 而是接着添加,所以 ...
- Android Touch事件传递机制引发的血案
尊重原创:http://blog.csdn.net/yuanzeyao/article/details/38942135 关于Android Touch事件传递机制我之前也写过两篇文章,自觉得对Tou ...
- 关于移动端的Click事件
在移动端执行Click事件,通常情况出现有300毫秒的延迟,为防止这种不必要的延迟效果,我们可以换种方式来实现,同样达到快速执行Click事件的效果. 先了解一下移动端Click的执行顺序: touc ...
- safari浏览器click事件要点击两次才有响应出现闪烁
闪烁问题 由于在iOS Safari上click事件存在300ms响应延时,所以为touch事件添加样式,会和click事件默认样式叠加而产生闪烁问题. 因为ios safari浏览器中对触摸事件的响 ...
- ios下Safari无法触发click事件的处理
ios下的Safari真是傲娇啊,坑好多. 首先上代码 <!DOCTYPE html> <html> <head> <title>122</tit ...
- 关于IOS下click事件委托失效的解决方案
一.由于某些特殊情况下,需要用到事件委托,比如给动态创建的DOM绑定click事件,这里就需要事件委托(这里就牵扯到:目标元素和代理元素)目标元素:动态创建的元素,最终click事件需要绑定到该元素 ...
随机推荐
- 【POJ 2653】Pick-up sticks 判断线段相交
一定要注意位运算的优先级!!!我被这个卡了好久 判断线段相交模板题. 叉积,点积,规范相交,非规范相交的简单模板 用了“链表”优化之后还是$O(n^2)$的暴力,可是为什么能过$10^5$的数据? # ...
- 【BZOJ 2818】gcd 欧拉筛
枚举小于n的质数,然后再枚举小于n/这个质数的Φ的和,乘2再加1即可.乘2是因为xy互换是另一组解,加1是x==y==1时的一组解.至于求和我们只需处理前缀和就可以啦,注意Φ(1)的值不能包含在前缀和 ...
- LRU设计
list是双向链表,map保存key对应到list中的迭代器的位置,list保存<key,value> class LRUCache{ public: LRUCache(int capac ...
- 控件 UI: StateTrigger
VisualState 之 StateTrigger 示例1.自定义 StateTriggerControls/UI/VisualState/MyDeviceFamilyStateTrigger.cs ...
- 最新版CocoaPods的使用与安装-以导入ReactiveCocoa框架为例
一.什么是CocoaPods?前言: 思考如何引入一个第三方框架. 例如: 百度地图SDK.友盟.ShareSDK. 信鸽推送等.从github或某处下载第三方SDK工程中导入所需要的SDK的文件 . ...
- c#读取excel
Provider根据实际EXCEL的版本来设置,推荐使用ACE接口来读取.需要Access database Engine. 注意修改注册表以下两项的值为0.否则导入EXCEL当单元格内字符长度超过2 ...
- android备忘录
1.跑马灯-滚动字幕 多用于广告,在屏幕上方滚动显示,可以是文字,图片等 #滚动字幕 TextView 中加(singleLine="true",ellipsize="m ...
- 使用Github Pages创建自己的网站
这是一篇使用Github Pages创建自己网站的教程,操作很简单,相信,亲们肯定一学就会,但是大家也要有一定的github基础呀,所以小编给大家附上一个链接(http://www.cnblogs.c ...
- Codeforces Round #389 Div.2 E. Santa Claus and Tangerines
time limit per test 2 seconds memory limit per test 256 megabytes input standard input output standa ...
- Uva1515 Pool construction
Time Limit: 3000MS64bit IO Format: %lld & %llu 网络流 最小割 心生绝望,用了好久的网络流模板居然是错的. ↑居然之前还侥幸能过一堆(并不)题. ...