位置: 编程技术 - 正文

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

编辑:rootadmin

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

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

什么是事件委托

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

事件委托的原理

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

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

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

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

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

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

看上面的代码,很简单吧,没什么问题吧,除了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获取浏览器宽度)

  • 离职人员补发工资怎么做账
  • 软件著作权费用怎么入账
  • 转让不动产增值税预缴
  • 应收账款核销后收回
  • 增值税专用发票几个点
  • 服务行业有哪些工作
  • 所得税网上申报表
  • 2021年路桥费抵扣最新政策
  • 报废固定资产增值税税率
  • 公司成立后一直没有收入
  • 工资计税基数
  • 技术咨询合同书
  • 增值税附加税怎么计提
  • 2019年化妆品
  • vue3 provide inject
  • 白内障手术费用大概几天出院
  • 什么是CMOS什么是BIOS
  • 如何解决心脏供血不足
  • 材料成本差异如何理解
  • 年度中间适用的预扣率高于全年综合所得年适用税率
  • 公司党员活动日方案
  • 巨浪向我冲来改为拟人句
  • 存货的采购成本包括
  • 营业外收入不计入所有者权益吗
  • 出售报废边角料税率
  • 买一赠一的会计处理与税务处理
  • 在高地陶恩山脉的滑雪旅行,奥地利巴德加斯坦 (© RooM the Agency/Alamy)
  • 业务招待费的账务处理金额
  • nodejs安装与配置
  • 以前年度损益调整
  • php单例模式连接数据库
  • vue环境搭建及配置简书
  • 详解Yii2 rules 的验证规则
  • php自动生成文章
  • php开启mysql扩展
  • 存货盘盈的账务处理入什么费用
  • 命名空间 php
  • 资本公积常用的计量方法
  • 没有开具发票的收入如何入账?
  • 营业成本的构成
  • 工程服务费税率是多少2023
  • 贷款用途不符合规定有啥危害
  • 基本户与一般户的区别与联系
  • 以资抵债如何实现债权和物权的转
  • 其他应付款怎么冲平影响会计利润吗
  • 出差发生的招待费计入差旅费吗
  • 已付款但未收到发票怎样记账
  • 普通发票红字冲销怎么操作流程
  • 新政府会计固定资产的核算与计量
  • 股东出资怎么写
  • 房地产开发企业会计制度
  • 工业企业成本核算的一般程序包括下列的
  • 安全费用支付
  • 结转已售材料成本6000元
  • 企业债与公司债的还款有区别
  • 应付账款怎么做平
  • mysql数据库主机一般填什么
  • freebsd怎么安装
  • win10系统怎么清理
  • 命令行教程
  • rhel7
  • win80x0000007b修复
  • win8无线连接不可用怎么办
  • Manjaro Linux 0.8.13发布下载 可将系统装入SD卡
  • WIN7系统如何设置开机密码和屏保密码
  • unity 加载文件 卡顿
  • 关于session的用法哪些是错误的
  • Python3.6 Schedule模块定时任务(实例讲解)
  • android 基础
  • Android studio配置环境
  • linux -lc
  • Unite Beijing 2015大型活动
  • dom方法总结
  • JavaScript焦点事件、鼠标事件和滚轮事件使用详解
  • python中私有函数调用方法解密
  • 河南税务总局发票查询
  • 开电子发票流程步骤
  • 沥青进口需要配额吗
  • 开地税发票的操作流程
  • 福州水费出账时间
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设