写了一个下拉菜单,在单击空白地方的时候隐藏。

第一时间就是用$(document).click(function(){   //隐藏代码  });

各大浏览器都没问题,唯独iPhone上的不会触发事件。

后来排查了一遍原因发现,Safari中是这样处理事件冒泡的:

1.点击某个DIV或其他元素。

2.发现没有处理该事件,继续往上冒泡。

3.直到冒泡到body下面的子节点为止,还是没有人处理该事件的话,就把该事件丢弃掉。不再往上冒泡。

4.只要在这一条冒泡链当中,有一个节点处理了该事件,它就不会丢弃该事件,会继续往上冒,冒到body 然后document 然后window .

问题发现了,就是必须要有一个人处理这个事件,才会继续往上冒。

那么解决办法就是在body的下级,写个空函数接收一下事件。就行了。

$("body").children().click(function () {

//这里不要写任何代码

});

完美解决!

iPhone safari中Document事件不触发的解决方案 [冒泡]的更多相关文章

  1. Win7下的DragEnter、DragDrop事件不触发的解决方案

    Win7与原来的XP和Win2003相比,安全控制方面更严格.比如,当我们以administrator登陆XP或Win2003时,运行所有的程序即是以管理员的身份启动的.但当以administrato ...

  2. SharePoint 2013 页面中window/document.onload/ready 事件不能触发的解决方案

    问题1:在SharePoint 2013页面中使用Javascript 事件window/document.onload/ready时,你会发现处理onload/ready事件的代码根本不能执行. 问 ...

  3. vue 中scroll事件不触发问题

    在vue项目中需要监听滚动条滚动的位置,结果写了scroll监听事件就是不生效,最后查资料发现是页面有样式设置了over-flow:scroll,去掉之后完美解决.(页面样式中存在over-flow: ...

  4. 使用input file上传文件中onChange事件只触发一次问题

    每次上传文件的时候,都会将当前的文件路径保存至$event.target.value中,当第二次选择文件时,由于两次$event.target.value相同,所以不会触发change事件. 解决方案 ...

  5. sencha touch 在新版谷歌浏览器中painted事件无法触发解决方案以及carousel 控件、togglefield控件、滚动条失效

    在2.3/2.4版本中,新版谷歌浏览器(43.44版本)里面painted事件是不会触发的,以及carousel 控件.togglefield控件.滚动条失效,官方的解决方案如下,测试可用 会出现这个 ...

  6. WPF数据模板中绑定事件不触发问题

    今天比较闲,做一个练手的项目,结果在xaml中写了一个用户的数据模板后,在其中的某个Canvas上绑定了一个鼠标左击的事件,结果调试的时候,无论怎么点击都不跳到断点那里,百思不得其解. 之后尝试不绑定 ...

  7. iphone safari浏览器CSS兼容性的解决方案集合

    1.iphone safari不兼容CSS的active的解决方案如下: <body ontouchstart="" onmouseover=""> ...

  8. [转]iOS Safari 中click点击事件失效的解决办法

    iOS Safari 中click点击事件失效的解决办法 问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素 ...

  9. iOS Safari 中click点击事件失效的解决办法

    问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素添加click事件时,如果事件是委托到 document  ...

随机推荐

  1. 《JAVASCRIPT高级程序设计》原生拖放和媒体元素

    一.原生拖放 最早在网页中引入javascript拖放功能的是IE4,当时,网页中只有两种对象可以拖放:图像和某些文本.而现在,几乎网页中的任何元素都可以拖放以及作为放置目标.下面介绍一些与拖放相关的 ...

  2. C++ 头文件系列 (algorithm)

    简介 algorithm头文件是C++的标准算法库,它主要应用在容器上. 因为所有的算法都是通过迭代器进行操作的,所以算法的运算实际上是和具体的数据结构相分离的 ,也就是说,具有低耦合性. 因此,任何 ...

  3. i++;++i的区别

    看代码! public class Test1 { //i++和++i的区别 int z; public static void main(String args[]){ int i ; int j ...

  4. Linux驱动技术(四) _异步通知技术

    异步通知的全称是"信号驱动的异步IO",通过"信号"的方式,放期望获取的资源可用时,驱动会主动通知指定的应用程序,和应用层的"信号"相对应, ...

  5. node文件中的package.json文件解析

    { "name":"myejsapp", "version":"0.0.0", "private": ...

  6. 安装grub

    安装windows后,grub不见了 先安装Neo进入Linux 两条命令搞定. 在root用户下输入: update-grub grub-install /dev/sda

  7. redux 初识

    前言 Redux 试图让 state 的变化变得可预测 react/react-native 将组件的更新交给了状态机(state),想要更新页面活着页面的某个组件就必须得通过改变state的方式.页 ...

  8. java程序员--小心你代码中的内存泄漏

    当你从c&c++转到一门具有垃圾回收功能的语言时,程序员的工作就会变得更加容易,因为你用完对象,他们会被自动回收,但是,java程序员真的不需要考虑内存泄露吗? 其实不然 1.举个例子-看你能 ...

  9. Angular.js之指令学习笔记

    <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"& ...

  10. Spring 数据源

    1.使用org.springframework.jdbc.datasource.DriverManagerDataSource说明:DriverManagerDataSource建立连接是只要有连接就 ...