JQuery中的事件委托
JQuery 中的事件委托
定义
事件委托就是利用冒泡的原理，把事件加到父级上，通过判断事件来源的子集，执行相应的操作，事件委托首先可以极大减少事件绑定次数，提高性能；其次可以让新元素的子元素也可以拥有相同的操作。可以理解为生命一个全局标量，所有的子元素，都要执行我声明父元素的参数。
事件与事件委托代码对比
事件 <!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-1.12.4.min.js" ></script>
<script>
$(function(){
$ali = $('#list li');
$ali.click(function() {
$(this).css({background:'red'});
});
})
</script>
</head>
<body>
<ul id="list">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</body>
</html>
事件委托 <!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-1.12.4.min.js" ></script>
<script>
$(function(){
$ali = $('#list');
$ali.delegate('li','click',function(){
$(this).css({background:'red'});
})
})
</script>
</head>
<body>
<ul id="list">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</body>
</html>
易错点
事件委托，用delegate（委托）词；由于事件委托 都是子元素委托给了父元素，因此声明的是父级元素，不许要声明子元素；
转载于:https://www.cnblogs.com/zqlboke/p/9017000.html
JQuery中的事件委托相关推荐
- vue学习：事件传递（冒泡和捕获），事件委托，jquery中的事件委托，$event 获取元素，vue事件修饰符
事件传递 ----冒泡和捕获 DOM事件标准定义了两种事件流,这两种事件流分别是捕获和冒泡. 和许多Web技 术一样,在它们成为标准之前,Netscape和微软各自不同地实现了它们.Netscape选 ...
- jQuery中绑定事件的几种方法
以click事件为例,jQuery中绑定事件有三种方法: (1)target.click(function(){}); (2)target.bind("click",functi ...
- 四、jQuery 中的事件和动画(嘎嘎详细)
文章目录 前言 一.事件 1.1 加载 DOM 1.1.1 执行时机 1.1.2 多次使用 1.1.3 简写方式 1.2 事件绑定 1.2.1简单使用 1.2.2 简写绑定事件 1.3 合成事件 1. ...
- jQuery中的事件机制深入浅出
昨天呢,我们大家一起分享了jQuery中的样式选择器,那么今天我们就来看一下jQuery中的事件机制,其实,jQuery中的事件机制与JavaScript中的事件机制区别是不大的,只是,JavaScr ...
- JQuery中的事件和选择器
学习jQuery最应该了解的也就是JQuery中的事件和选择器. 那么常见的事件有哪些: 鼠标事件:mousedown鼠标按下,mouseup鼠标松开,mouseenter鼠标进入某个元素 mouse ...
- jquery中的事件和动画
目录 一.jquery中的事件 1.加载DOM 2.事件绑定 3.合成事件 4.事件冒泡 5.事件对象的属性 6.移除事件 二.jquery中的动画 1.隐藏和显示 2.滑动效果 3.淡入淡出效果 三 ...
- java中jquery怎么学,浅谈jQuery中的事件--Java学习网
核心提示:JQuery事件初见1.JQuery中的事件绑定其实呢,JQuery中标准的事件绑定是这样写下:(如下)代码如下:$('#btn').bind('click',function(){}):但 ...
- jQuery 中的事件参数传递机制
jQuery 中的事件参数传递机制 jQuery事件参数传递模型: 注:trigger 不能与 bind 的原生函数一样,使用同样的参数传递形式: 参数传递一: $(document).ready(f ...
- jQuery 中的事件冒泡和阻止默认行为
jQuery 中的事件冒泡和阻止默认行为 参考资料: <锋利的jQuery> 作者:单东林 张晓菲 魏然 出版社: 人民邮电出版社 1.事件冒泡 [javascript] vi ...
最新文章
- 常用数据绑定控件详解
- 个性化推荐系统该如何评估，四种不同策略的角度
- LCD也可以模拟？这款模拟器别错过了！
- 眉骨高者为大贵之相_什么样才算富贵相？曾国藩的识人秘诀(组图)
- js(Dom+Bom)第三天（2）
- UNICODE十六进制数组转成中英文
- 转 db_file_multiblock_read_count
- file android closed,Reading a json file in Android [closed]
- 利用树莓派完成POS58打印机的无驱动打印（初学者）
- DHCP中继 ||| 四种通信方式（单播+组播+广播+任播）
- NOIP / CSP-S/J初赛基础知识1
- k8s eviction机制
- 从0开始建设saas - 系统对接中的问题整理
- c#多文档文本编辑器
- 悦然插件资源分享：WooCommerce Order Details订单详情插件
- Vijos 1166题：木牛流马
- 加入域找不到网络路径提示错误的解决方法
- 基于simulink的MPPT仿真输出最大功率
- 天下大势，分久必合，合久必分
- 如何让APP不在settings/Notifications/Recently sent中显示（MTK6757 Android9.0）