27.尚硅谷_jQuery_事件委托.avi原创

讲过没有讲过行，讲过就好说了啊。先还是来去做一个效果，你先把这个效果我们先做出来啊，我的需求是什么呢？看着啊，点击ii背景就会变成红色，就这里面很多ii吗？这好做吧，这轻而易举，看它怎么做多了图ul下面的什么ii，给它们加点击监听是吧，一点击就让他的style.background等于一个红色。是吧，你说你一点。OK，它行不行不行，因为我是ul下面的ii对吧，而它是不是个单独的ii啊，不行，好了，下面我再做工作，我点击button乘一给它添加一个ii，也就是说我不有这一个它吗？啊是八点八十一来点击这个八点，我们来试一下啊，这也好做，就咱刚才做过类似的事情啊，点很立哪一个方现添加一个ii，那我有两种方式，一种是先找到ul。

哎，找到ul是吧，Ul接着呢，A pen是吧？啊接着是不是搞一个什么，哎哎，这是不是新增的。能不懂好来看一下刷一下走你。我这个是加号井号，这不是ID吗。走你有没有有，但是假如说但是了点上面可以点下面不行。

是吧，这个是不是新增的呀？啊，那我们现在是不是面临一个问题。新增的还必须后面是不是再加监听，其实我们刚才就碰到过这个问题吧，刚才我们的解决方式怎么解决，是不是给新增的又去增加，又去加这个点击丁，那其实我们完全可以用什么事件代理，或者叫事件委托，或者叫事件委派。一共三个概念，其实是同一个概念啊，其实是同一个概念啊，有叫事件委托的，有叫世建委派的。还有叫什么呢，事件代理的也都说同一个。能不能懂？好，首先你要知道啊，这个事件委托说的是一个什么事情，既然你们说过，那我就得问一下人，问一个同学，你来给我表达一下什么叫事件委托。

嗯，陈松。你说一下什么是事件委托，忘记了呀？啊，汪涵感觉听燕姐这么变，这汪涵就家庭个新增教那个世界，你说你的描，你那现在描述的是那个事界委托需要的一个需求，你现在告诉我什么是事件委托，就是发发事件，事件上面啊啊大概差不多啊，其实很简单举例子，很多时候举例子特别好说明问题。

我有一个ul，我有下面1万个ii。你要说的要恐怖一点对吧？啊，现在呢，我要给所有ii都加点E1，也就是说我的点击每一个ii是不是都要能响应，能懂不？那我们定的做法是不是给每一个I都加减零零，那这么做有什么问题啊，一个是监听太多，再一个新增的他没有是吧？那事件委托是个什么概念呢？其实非常简单，就将子元素的事件交给谁去处理，负元素来代为处理。积分如果你直接用语言来表达的话，就是将子元素的事件交给负元素代为处理，但是负元素真正处理的时候，它知不知道是哪个元素发生的，必须得知道，那要不知道，我怎么知道你点的哪个I呢？你得想啊，我要不知道的话，我要不知道事件发生在哪个子元上面，比如说我点某一个ii，他怎么知道要让哪一个元素变成红色背景呢？

肯定得知道，为什么能知道。这个是关键点，他一问他看什么东西啊。事件发生了，什么目标，什么目标，目标元素，说白了，你点到了一个ii。对不对啊，世界稳托它是一个过程，将多个子元素举个例子，譬如说ii的事件，先听委托给什么负元素，譬如说什么ul。监听回调是加在什么负元素上面，也就这个负元素不一定是负元素，也可复倍元素，是不是也可以啊，也可以啊，当操作任何一个子元素时，事件会有什么？诶，这个要实现委托必须有一个概念叫什么冒泡。

好负元素不会直接他自己来处理事件，而是根据什么呢？点target得到什么？某一个子元素，通过子元素来调用这个回调函数，那也就是说什么。回调函数中的意思要是谁的问题对不对？也就是说回调函数中的意思是我的复原数吗？那我们就要看看了，对不对，这个很关键的。也说到底是负元素还是发生事件的那个元素，这个至关重要。啊来我们来去先写一写啊，还是刚才这个东西对不对，还是刚才的东西，我们也就是说我们的这个地方涉及到两个东西，一个叫委托方。

啊，这个里面就涉及到我们生活中的一个概念，一个叫业主，一个叫封建是吧。是吧，业主是不是有房子啊，是不是交给委托给什么，是不是中介去处理啊，是不是。所以很多业主都会将他的房子交给同一个中介。对吧，啊，那业主是什么。是不是ii啊，而我们也是委托方被有原方是谁了，那个中介也是列负元素ul，我我是这是举了例子，不一定是ii和ul，对不对啊，举例子说明啊。好，我们来去用一下，看看怎么样在这块里面怎么样实现委托啊，其实非常简单，他这里面有方法。我们来看一下，这里面有一个方法啊，这这什么意思。

啊，他就是委托委派的意思啊，Delegate什么意思呢？来我们来看它的一个例子就行，看他的一个例子，外面呢，有一个div，里面有一个八层。事件最终发生在谁身上，但是事件委托给了谁？Div，你看他这个这么整。他是不是先去找到我的复元素。接着调用单的方法是吧，去管理谁是不是它化成事件的某一个子元素吧，或者某几个子元素对不对，这是一个什么，这是个选择吧。这什么意思？代理什么事件呢？你这个世界是不是有个世界名啊？这是什么？是不是毁掉函数？好，来，那我们就一葫芦画瓢呗。首先啊，找到谁ul。

是吧，找到ul接着呢。调用什么方法，Delegate方法。诶，怎么不提示我啊？好，传嘴，首先我们来看一下单的第一个参数，传，稍微传一个选择器，找某某些子元素吧，那我这里传什么I记着代理什么事件呢？可立刻来接着什么发现在至关重要的是谁了，就是这个this是谁。这个非常有意思是吧？Z是谁啊？我们来看一看。看看这个认识是谁啊？

点是谁，是我点击发生事件的ii吧，但是你就得想啊，我现在事件是不是加在ul上面呢？他怎么知道你给的AI。他是如何知道你点的是哪个ii标签呢？其实这里面一定要理解这一句话。也就是说，你调用事件回调函数的是那个负元素吗？不是，如果调用回调函数的是那个负元数，那意思就是复原差。是不是不是，而是那个什么发生事件的那个什么子元素，那也就是说，那怎么得到那个子元素呢。这个event里面有一个非常重要的属性叫什么，它给我是不是通过它这个对象，这个对象来去调用回的函数啊。

能不能懂诶，我怎么样让一个让它能够去能够去突然间调用这个回的函数啊，一个函数，我怎么让这个函数能，它上面有这个函数吗？这个元素上面有这个函数吗？没有，那我怎么让他去能够调用这个函数呢？扩呀。扩能懂吗？我们前面说过可以让一个函数成为任意对象的方法进丢。嗯，这是我们前面学的东西，看看大家是不是真的理解了，就一个函数可以成为任意指定对象来调用。懂吗？啊，OK，好，那有了它以后你说我该怎么做，我知道这个事情事实啊，下面我要实现效果怎么实现，非常简单的啦，This，点点background等于right是吧？好，而且我要把这句话拿过来。

可以吧，啊，这是那个8.1是吧，诶8.1。可以吧，好，我们来看一下啊，现在是一个什么样的效果。各位可以啊，这个还不能说明问题对吧，不能说明问题下一个。可不可以，我是不是新加的就自动能够进行事件响应了。太好了。有可能就说老师他怎么就能响应的了。是不是你在想，现在我的世界加在谁身上了？是不是加在YL上面呢？

那也就是说他去找子元素是不是动态找的，是不是动态找的，他管你是以前的还是新的宝宝，不管他知道你是新来旧的宝，他也不知道，他哪知道你新的旧的。你只要是它的子元素就好了。能不能理解啊，OK，诶，你说我要加的不是一个I，我加的是半形。行明，我要加的是10万，我加的。行不行？行还是不行呢？不行，为什么不行？很简单，你那你这个东西白写了吗？你选他就哎干嘛呢。能不能理解我现在是这个UI带理谁去，是不是带你这个ii的事情啊，你好，你后面加一个span，那那怎么能响应呢，这span我是不是不管呢，这个要能懂啊，啊这个是说我们用来实现事件代理还是非常舒服的，但是重点大家一定要把这个过程搞清楚。

啊，还有一个我们委托有什么好处，两个，第一个新增的元素自动有什么世界条件处理有没有有不用担心这个事，第二个事情减少事件监听的什么数量从N个变成了什么一个，N个是指谁的，N个是不是这里面ii的数量。那占用内存是不是小很多啊？

嗯。很好，那除了设置世界委派，他还有什么呢？移除世界委派，也就是说我开始有世界委派，后来我想移除，怎么移除了？来这个地方我还有一个按钮呢。还有一个按钮叫八神级的啊，现在我不是去啊，上面是不是设下面的，哎，下面的这里面大家看看啊，我上面在这里面是不是设置了世界委巴，一上来就设置了世界委了，呃，世界委托吧。好，现在我要干嘛去去移除，移除事件委托。怎么移除了？来看着。找到谁，你说不用呗。干嘛去了点on delegate on delicate on什么意思？是不是取法的意思？是不是遗嘱接着。

可以指定一下什么什么样的世界。能不懂，其实我可以去，我可以去整多个多种事件，不仅是可以整，我是不是同时还可以整别的事件啊，OK，这个地方大家也可以从这里看看。在哪嘞？其实还有参数可以传啊，还有别的参数可以传的OK。这个大家自己可以看，你说这个是啥意思。不传参数，那就把把我身上所有的世界危害是不是都移出来，这啥意思哦？只移除什么？点击我要有别的移除吗？不移除。

能懂吧，其实对我们当前我一定要查肯定嘛。我能不团，因为我就一个是吧，OK，来试一试。那也就是说当前是有时间委托的吧，是吧，那就说取消再来一个还能行吗？还有没有没了就这么简单的事啊好做完这个东西以后啊，我们把它啊来说一下这个里面啊，我们能不能把我的应用给它简化一下哟。看下C，看下V，我来个R吧，好吧。哪个？也就是说刚才我们是没有用事界委托呀，那我们实际上可不可以用，可以用对吧？好，可以用怎么用法是不是怎么用法，那首先啊，首先我们是去找A去加世界吧。

是这么做吗？不是。对吧，我们只要找一个它的复元素，是不是就可以那找负元素找A的水呢。啊，这里面那就只能是什么，我就找推广行不行可以吧，就找他是不是啊就找他好，那也就说我还不需要这个了吧，不需要这个了，来看他怎么做啊，它有ID整他，哎好说出来，接着呢，调用什么话，世界委托啊点gate。找里面的什么A是吧，什么事件可立可事件是吧，再接着就什么是不是回调函数，这个回调函数我能不能就传它呀。

你刚才不就这么传的回函数就传着他吗？那我凭啥我现在不行了呢。而这个里面，这个里面这个回答是this是谁？所以发生事件的那个元素，也就是你点击那个A吧，对不对对的啊，记住了啊，通过啊table来啊，推什么委托。实现对谁的委托，所有A的什么委托，是不是A所有A的什么委托，肯定个世界委托是吧，好，那这个时候我有了它以后我哪个位置不需要了。

这一片不需要啦。对不对，看懂吧，好，我们来试一试，看看是不是这样啊，是不是我就写这么点好了嘞。先看原有的信息。三组包包是吧，三各位三可以好再来一个随便写啊。诶，好像真有反应。是不是可以明显这个写起来要什么，是不是要简单呢？还有这个效率也高啊。嗯，就整个事啊，这个记住了，在事件委托里面有几个重要的点，大家一定要跟别人能说清楚，第一个事件是加在哪个上面的负元素，这第二个要想实现世界委托，必须有一个高，有一个操作，有一个概念叫什么呢？世界冒泡。

也就是说，事件真正是发生在负元素还是子元素？子元素但它冒泡到了什么负元素上？那最后真正去调用事件回调函数的是谁？谁子元素发生事件的子元素啊，这是这里面关键的三个点，这三个点你一定要能表达清楚。事件委托事件委派这个概念在面试中问的比较多啊，大家一定要能说清楚。嗯，别的就没有什么啊，嗯，行。