jQuery事件委托之Safari(jquery事件委托原理)

编辑：rootadmin

推荐整理分享jQuery事件委托之Safari(jquery事件委托原理)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:jqueryon事件委托,jquery中事件委派,jq事件委托的方法,jquery中事件委派,jqueryon事件委托,jquery中事件委派,jqueryon事件委托,jquery实现事件委托,内容如对您有帮助，希望把文章链接给更多的朋友！

什么是事件委托

事件委托是Jquery中一种事件绑定的方式，不同于常见的事件绑定方式将事件绑定在目标元素上，而是将事件绑定在父级元素上通过事件冒泡来执行绑定函数。

事件委托的原理

事件委托将事件监听绑定在目标元素的父级上，当目标元素响应事件时冒泡到绑定事件的父级上，进行判断该事件的目标元素是否是传入的元素，如果是就执行传入的函数。

没有做任何的兼容以及其他处理，只是为了了解原理，大家有什么问题可以留言指出。事件委托有什么用呢

说这么多东西，到底事件委托有什么用呢？我认为事件委托最大的好处在于，动态生成的元素还会保留原有的事件绑定。

今天的主题，事件委托之Sarfari

一次项目中遇到的问题，click事件委托在移动端的safari上失效了

看上面的代码，很简单吧，没什么问题吧，除了ios的safari，其他浏览器都能正常的弹出“ok”，一开始想到会不会是什么有地方把冒泡阻止了，但是没有找到，jq的问题？，换了还是不行。正常的绑定（不使用事件委托）没问题，其他想到会不会是jq的bug，如果是jq的bug，那么以前的项目也会有类似的bug，于是到线上去找相关的代码

在安卓和ios设备上测试，没有任何问题，代码都差不多啊，但是大家注意到没，标签不一样（html语义化多重要啊），于是将p换成a，问题完美解决，最后去谷歌了一下。

ios的safari中当使用委托给一个元素添加click事件时，如果事件是委托到 document 或 body 上，并且委托的元素是默认不可点击的（如 div, span 等），此时 click 事件会失效。

原因很清楚了，safari中不可点击元素的click事件不会冒泡到document和body上。

解决办法

1.将click事件直接绑定到元素上（不使用事件委托）

2.需要绑定click事件的元素改成<a>或者<button>等可点击元素

3.将click事件委托到非doucument或body的父级元素上

4.给目标元素添加一条css样式 cursor:pointer（推荐这种，方便省事）

以上所述是小编给大家介绍的jQuery事件委托之Safari，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对积木网网站的支持！

jQuery获取浏览器类型和版本号的方法废话不多说，关键代码如下所示：$(document).ready(function(){varbrow=$.browser;varbInfo="";if(brow.msie){bInfo="MicrosoftInternetExplorer"+brow.version;}if(brow.mozilla){bInfo="MozillaFir

jQuery 3.0十大新特性 jQuery3.0在日前发布了最终的全新版本。从年月，jQuery团队对这个主要大版本进行维护开始，web开发者社区便一直在期待着这一刻的到来，终于在

Spring MVC中Ajax实现二级联动的简单实例今天写项目遇到了二级联动，期间遇到点问题，写个博客记录一下。后台Controller：@RequestMapping("/faultType")@ResponseBodypublicMapString,ObjectfaultType(intid,HttpServlet

标签: jquery事件委托原理

本文链接地址:https://www.jiuchutong.com/biancheng/385841.html 转载请保留说明！

上一篇：JQuery组件基于Bootstrap的DropDownList（完整版）(jquery.browser)

下一篇：jQuery获取浏览器类型和版本号的方法(jquery获取浏览器宽度)