http://www.blogjava.net/Hafeyang/archive/2011/04/19/the_implementation_of_jquery_delegate_and_live.html
window.onload = function(){
function handle(e){
//获取event对象
//标准DOM方法事件处理函数第一个参数是event对象
//IE可以使用全局变量window.event
var evt = window.event?window.event:e;
//获取触发事件的原始事件源
//标准DOM方法是用target获取当前事件源
//IE使用evt.srcElement获取事件源
var target = evt.target||evt.srcElement;
//获取当前正在处理的事件源
//标准DOM方法是用currentTarget获取当前事件源
//IE中的this指向当前处理的事件源
var currentTarget= e?e.currentTarget:this;
//问题:在IE 9下 window.event 与 e 不同 evt没有currentTarget属性,e才有currentTarget属性(视为标准浏览器做法??)
alert("src id:"+target.id+"\ncurent target id :"+currentTarget.id);
if(target.id=="newbutton"){
alert("触发新增元素的delegate方法");
}
}
document.getElementById("btn").onclick=handle;
document.getElementById("c").onclick= handle;
document.getElementById("btnadd").onclick=function(){
var btn = document.createElement("input");
btn.setAttribute("value","点击我试试");
btn.setAttribute("type","button");
btn.setAttribute("id","newbutton");
//没有监听新按钮的onclick事件
document.getElementById("c").appendChild(btn);
}
}
<div id="c" class="">
<input type="button" id="btn" name="" value="button" />
</div>
<a href="###" id="btnadd">添加一个按钮</a>
这个应该是用事件的冒泡特性实现代理的把
分享到:
相关推荐
在探讨jQuery中的`bind()`, `delegate()`, 和`live()`事件绑定方法的区别时,我们需要深入理解它们在处理DOM事件时的独特方式。这些方法在不同的场景下提供了灵活且高效的选择,帮助开发者创建响应式和动态的Web应用...
尽管从jQuery 1.7版本之后,.delegate()方法已经被.on()方法所取代,但在早期的jQuery版本中,这两种方法都广泛被用于实现事件委托机制。下面我将详细介绍这两种方法的用法、区别以及它们各自的适用场景。 首先,...
今天我们将深入探讨jQuery中的事件绑定方法,包括`bind()`, `live()`, `delegate()`,以及后来推出的`on()`方法。这四个方法都是为了帮助开发者更方便地管理页面上的事件,特别是对于动态生成的元素。 1. **bind()*...
习惯了bind,用惯了live,就不习惯delegate了呀有木有… 支持为动态生成的标签元素绑定事件也许就live和delegate了吧,不过新版本已经不支持live了,只有delegate delegate真的比较特殊呀,不同于其他事件绑定的风格...
在jQuery中,管理事件的方式经历了多个版本的演变,而delegate()与live()方法就是旧版本中用于处理事件的两种不同方式。在现代jQuery开发中,虽然这两个方法已经被on()方法所取代,但了解它们依然对于理解和维护早期...
在jQuery库中,`delegate()`方法是一个非常有用的事件处理程序绑定功能,它允许开发者为动态创建的元素或一组元素绑定事件。这个方法尤其适用于那些在DOM加载时并不存在,但在之后通过JavaScript添加到页面中的元素...
主要介绍了jQuery中delegate()方法用法,实例分析了delegate()方法的功能、定义及为匹配元素的子元素添加一个或多个事件,并规定当这些事件发生时运行函数的使用技巧,需要的朋友可以参考下
主要详解了jquery事件delegate()的使用方法,delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数,感兴趣的小伙伴们可以参考一下
本文将深入探讨jQuery中的事件代理方式,包括`live`, `delegate`和`bind`的区别与联系。 ### 事件冒泡与事件代理原理 事件冒泡是指事件从最深的节点开始,逐级向上层节点传播事件的过程。当一个元素触发事件,该...
虽然live方法在jQuery 1.9版本中完全被移除,但delegate方法一直被保留,而且它提供了一种更加灵活的方式来实现事件委托。Delegate方法允许我们指定一个父元素,然后为该父元素及其子元素中的符合特定选择器的元素...
在jQuery1.7中 .delegate()已被.on()取代。对于早期版本,它仍然使用事件委托的最有效手段。在事件绑定和委派,delegate()和on在一般情况下,这两种方法是等效的。 .delegate() 指定的元素(属于被选元素的子元素)...
在提供的`DelegateSample`压缩包中,你应该能找到一个具体的Delegate实现示例,包括定义协议、实现协议、设置Delegate以及处理事件的代码。通过阅读和分析这些代码,你会对Delegate有更深入的理解。记得实践是检验...
在探讨如何解决jQuery的delegate方法中select()事件无效的问题之前,我们先来梳理一下几个关键知识点:jQuery的delegate()方法的用途、select()事件的作用以及setTimeout()在解决事件绑定问题中的独特应用。...
在jQuery库中,有四种主要的方法用于绑定事件处理程序:`.bind()`, `.live()`, `.delegate()`, 和 `.one()`。这些方法各有特点,适用于不同的场景,下面我们将逐一深入探讨它们的用法和区别。 1. **.bind() 方法** ...
在我们日常开发中经常会使用到.bind()、.live()、.delegate()和.on(),有些同学会对这四者存在一些疑虑,所以下面这篇文章主要给大家介绍了关于Jquery中.bind()、.live()、.delegate()和.on()之间区别的相关资料,...