jQuery系列（十二）：事件委托
1、什么是事件委托
通俗的讲，事件就是onclick，onmouseover，onmouseout，等就是事件，委托呢，就是让别人来做，这个事件本来是加在某些元素上的，然而你却加到别人身上来做，完成这个事件。
举个列子：有三个同事预计会在周一收到快递。为签收快递，有两种办法：一是三个人在公司门口等快递；二是委托给前台MM代为签收。现实当中，我们大都采用委托的方案（公司也不会容忍那么多员工站在门口就为了等快递）。前台MM收到快递后，她会判断收件人是谁，然后按照收件人的要求签收，甚至代为付款。这种方案还有一个优势，那就是即使公司里来了新员工（不管多少），前台MM也会在收到寄给新员工的快递后核实并代为签收。
原理：
利用冒泡的原理，把事件加到父级上，触发执行效果。
作用：
性能要好
针对新创建的元素，直接可以拥有事件
事件源 :
跟this作用一样(他不用看指向问题，谁操作的就是谁),event对象下的
使用情景：
•为DOM中的很多元素绑定相同事件；
•为DOM中尚不存在的元素绑定事件；
示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body> <ul>
<li class="felix">felix</li>
<li>fff</li>
<li>fff</li> </ul>
</body>
<script src="../jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//通过on()方法
$('ul').on('click','#name,.felix',function(){
console.log(this);
});
//未来追加的元素
$('ul').append('<a id="name">relix</a>')
})
</script>
</body>
</html>
语法：
on(type,selector,data,fn);
描述：在选定的元素上绑定一个或多个事件处理函数
event.data。jQuery系列（十二）：事件委托的更多相关文章
- Web 前端开发精华文章推荐（jQuery、HTML5、CSS3）【系列十二】
2012年12月12日,[<Web 前端开发人员和设计师必读文章>系列十二]和大家见面了.梦想天空博客关注 前端开发 技术,分享各种增强网站用户体验的 jQuery 插件,展示前沿的 HT ...
- SQL Server 2008空间数据应用系列十二：Bing Maps中呈现GeoRSS订阅的空间数据
原文:SQL Server 2008空间数据应用系列十二:Bing Maps中呈现GeoRSS订阅的空间数据 友情提示,您阅读本篇博文的先决条件如下: 1.本文示例基于Microsoft SQL Se ...
- Alamofire源码解读系列(十二)之请求(Request)
本篇是Alamofire中的请求抽象层的讲解 前言 在Alamofire中,围绕着Request,设计了很多额外的特性,这也恰恰表明,Request是所有请求的基础部分和发起点.这无疑给我们一个Req ...
- struts2官方 中文教程 系列十二：控制标签
介绍 struts2有一些控制语句的标签,本教程中我们将讨论如何使用 if 和iterator 标签.更多的控制标签可以参见 tags reference. 到此我们新建一个struts2 web 项 ...
- 爬虫系列(十二) selenium的基本使用
一.selenium 简介 随着网络技术的发展,目前大部分网站都采用动态加载技术,常见的有 JavaScript 动态渲染和 Ajax 动态加载 对于爬取这些网站,一般有两种思路: 分析 Ajax 请 ...
- C#编程（四十二）----------委托和事件
委托和事件 委托是C#总比较重要的概念,学习C#爱这里最容易产生迷惑. 有些时候,犹豫我们在开发程序时对后续可能出现的要求及变化考虑不足而导致麻烦,这些新变化可能导致程序的重新编写,那能不能改变这种情 ...
- Alamofire源码解读系列(十二)之时间轴(Timeline)
本篇带来Alamofire中关于Timeline的一些思路 前言 Timeline翻译后的意思是时间轴,可以表示一个事件从开始到结束的时间节点.时间轴的概念能够应用在很多地方,比如说微博的主页就是一个 ...
- 学习ASP.NET Core Razor 编程系列十二——在页面中增加校验
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 【jQuery源码】事件委托
jQuery的事件绑定有几个比较优秀的特点: 1. 可以绑定不限数量的处理函数 2. 事件可以委托到祖先节点,不必一定要绑到对应的节点,这样后添加的节点也照样能被处理. 3. 链式操作 下面主要分析事 ...
- jquery on方法（事件委托）
jquery绑定事件处理函数的方法有好几个,比如:bind(),on(),delegate(),live(). 其中delegate和live都是用on实现的,效果也类似,live好像在1.7版本中已 ...
随机推荐
- Centos7下,宿主机nginx配合docker环境的php-fpm
一.安装docker并启动 yum install docker systemctl start docker 二.安装nginxCentOS 7默认不能从yum中安装nginx,原因可以自己搜索一下 ...
- vc++6.0中查看函数栈的结构
栈:一种后进先出的数据结构 比如:弹夹 函数调用的约定 传参顺序 传参媒介 如何传递返回值 平衡参数(堆栈平衡):有且只有被调方(callee)和调用方(caller)一方执行 _cdell (c ...
- 禅道工具的下载和使用（原地址：https://www.cnblogs.com/ydnice/p/5800256.html）
下载地址:http://sourceforge.net/projects/zentao/files/8.2/ZenTaoPMS.8.2.stable.exe/download 1.解压ZenTaoPM ...
- javascript之取余数、去商、天花板取整、地板取整
demo1: console.log('//求余数'); //求余数 console.log(5 % 4); console.log(6 % 4); //求商 console.log('//求商'); ...
- 论文阅读：Adaptive NMS: Refining Pedestrian Detection in a Crowd
论文阅读:Adaptive NMS: Refining Pedestrian Detection in a Crowd 2019年04月11日 23:08:02 Kivee123 阅读数 836 ...
- 7-MySQL DBA笔记-研发规范
第7章 研发规范 本章将为读者解读一份研发规范.为了更好地协同工作和确保所开发的应用尽可能的稳定.高效,建立一套数据库相关的研发规范是很有必要的,虽然研发规范的确立和推广是一项很耗时的工作,但所取得的 ...
- Jmeter4.0---- 修改jmeter源代码（18）
1.说明 jmeter本身功能很强大,但是在使用的时候我们会发现有些想法jmeter无法帮我们实现,这个时候就需要我们细节去修改一下它的源代码,来满足我们的需求. * 仅供参考 2.步骤 第一步: j ...
- centos7 + postgresql10
mysql被黑惨了,换了个超复杂的密码都不行,黑客会删除你所有的自定义库,然后插一个warning表,让你给他汇比特币. 提醒大家放在在公网的DB,要非常注意数据的安全性,万一被勒索了,真是mmp了. ...
- 在Android8.0以上收不到广播问题(AppWidget)
对Intent指定组件 //安卓8.0必须添加 intent.setComponent(new ComponentName(context,MyAppWidgetProvider.class)); 问 ...
- kalilinux 渗透测试笔记
声明:本文理论大部分是苑房弘kalilinux渗透测试的内容 第五章:基本工具 克隆网页,把gitbook的书记下载到本地 httrack "http://www.mybatis.org/m ...