事件代理

$(".div").on(‘click‘,function(e){

if(e.target==‘input‘){

console.log(e);

}

}

e为当前点击元素,input外层div添加事件可以减少dom元素加载。

时间: 2024-12-21 12:43:31

事件代理的相关文章

封装Js事件代理方法

// 封装事件代理 function delegateEvent(element, tag, event, listener) { // 判断是否支持addEventlistener if(element.addEventListener){ // 给父元素添加事件 element.addEventListener(event,function(e){ // 获取当前触发的元素 var target = e.target; // 判断当前元素是否是我需要的 if(target.nodeName.

JavaScript事件代理和事件委托

一.概述: 那什么叫事件委托呢?它还有一个名字叫事件代理,JavaScript高级程序设计上讲:事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件.那这是什么意思呢?网上的各位大牛们讲事件委托基本上都用了同一个例子,就是取快递来解释这个现象,我仔细揣摩了一下,这个例子还真是恰当,我就不去想别的例子来解释了,借花献佛,我摘过来,大家认真领会一下事件委托到底是一个什么原理: 有三个同事预计会在周一收到快递.为签收快递,有两种办法:一是三个人在公司门口等快递:二是委托给前台

Js - 事件代理

事件代理是利用了事件冒泡,制定一个事件处理程序,就可以管理某一类的所有事件.例如,click事件会一直冒泡到document层次(就是不断地向父元素传递至最上层的document).就是说可以为整个页面指定一个onclick事件处理程序,而不必单个元素分别添加处理程序. <ul id="ul1"> <li >item1</li> <li >item2</li> <li >item3</li> </

事件代理那些事

简单说说. 事件代理,顾名思义,就是把本应该是自己的事情来交给别人来帮你做,比如,你要卖房,你不可能一天到晚蹲在马路边见人就问要不要买房吧,这样不仅消耗能量,还效率低,在javascript中也是,如果需要绑定事件的元素多了,你如果为每一个都绑个事件的话,你受的了,浏览器也受不了,搞不好它就崩溃了,你就尴尬了,所以把事件代理到元素的父级上是个好方法. 怎么搞? 要了解它是怎么搞起的,首先要知道背后的秘密,事件代理的秘密很简单,那就是事件冒泡,事件冒泡大家肯定都知道,比如当你单击了一个元素,这个单

JavaScript事件代理入门

事件代理(Event Delegation),又称之为事件委托.是 JavaScript 中常用绑定事件的常用技巧. 顾名思义,"事件代理"即是把原本需要绑定的事件委托给父元素,让父元素担当事件监听的职务. 为什么要这样做呢? 众所周知,DOM操作是十分消耗性能的.所以重复的事件绑定简直是性能杀手.而事件代理的核心思想,就是通过尽量少的绑定,去监听尽量多的事件. 下面将会用 Zepto 为大家演示怎么实现事件代理. 啊?Zepto是什么? Zepto is a minimalist J

Delphi的基于接口(IInterface)的多播监听器模式(观察者模式 ),利用RTTI实现Delphi的多播事件代理研究

Delphi的基于接口(IInterface)的多播监听器模式(观察者模式 )http://www.cnblogs.com/hezihang/p/6083555.html 利用RTTI实现Delphi的多播事件代理研究http://www.cnblogs.com/hezihang/p/3299481.html

js事件代理(事件委托)最简单的理解

1事件代理:当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委托给父节点来触发处理函数. 例如:点击按钮删除对应的条目. 如果给每一个按钮添加事件,极为繁琐,这时候需要用到事件代理. 事件代理是基于浏览器的事件冒泡机制. 下面是对应的代码: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <

jQuery事件代理

DOM树 首先,可视化一个HMTL文档的DOM树是很有帮助的.一个简单的HTML页面看起来就像是这个样子: 事件冒泡(又称事件传播) 当我们点击一个链接时,其触发了链接元素的单击事件,该事件则引发任何我们已绑定到该元素的单击事件上的函数的执行,什么意思,就是说开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播到较为不具体的结点(文档) $('a').bind('click', function() { alert("That tickles!") }); 因此一

事件代理与事件处理流程

1.事件代理(事件委托)定义:当我们要对多个元素添加事件时,可以将事件添加给它们的父节点,而将事件委托给父节点来触发函数.<ul id="parent-list"> <li id="post-1"><a href="#">我是第1</a></li> <li id="post-2"><a href="#">我是第2</a

Atitit. &#160;Js 冒泡事件阻止&#160;事件捕获&#160;&#160;&#160;事件传递 &#160;事件代理

Atitit.  Js 冒泡事件阻止 事件捕获   事件传递  事件代理   1. 事件冒泡1 2. 事件捕获1 3. 同时支持了事件捕获阶段和事件冒泡阶段ddEventListener的第三个参数1 4. 事件代理3 5. 冒泡还是捕获?3 6. Js 冒泡事件阻止3 6.1. 返回false5 7. 事件冒泡 使处理函数有范围较大的触发面积,在“拖拽效果”脚本中是必须的5 8. refe6 8.1.1. 浅谈事件冒泡与事件捕获 - ac黄博客精选 - SegmentFault6   1. 事