标签:加载 网络 整理 play splay win 分发 事件委托 cti
1、通过网络搜索、对事件委托进行整理如下:
对于事件委托,从字面意思来看就是委托就是把事情交给别人去做,网上常用的例子就是送快递;
公司有三个人今天会同时收到快递,这时有2种方案解决,
1.三个人同时在公司门口等着快递(也就是说三个人绑定了同样的事);
2.交给前台MM去代理收快递,然后进行通知分发给每个人;
通过上面的例子不难理解事件委托的意思,就是委托别人去帮我实现我的需求;
2、事件委托的原理就是通过冒泡的原理,比如div>ul>li 给父集DIV加事件 那么点击li的时候 通过冒泡就会找到父集执行的函数,我们可以通过src.target获取事件源,事件源就是事件是那个元素出发的。那么我们来看实例
<div id="divElem" onclick="clickWt(‘e‘)"> <h1 class="city" id="city">City</h1> <ul class="oUl" id="oUl"> <li>广东</li> <li>深圳</li> <li>长春</li> <li>上海</li> <li>北京</li> </ul> </div>
JS代码部分:
var flog = true; function clickWt(){ var e = e || window.event; var tar = e.target || e.srcElement; //通过tagName 获取事件源元素 执行相应操作 if(tar.tagName == ‘H1‘){ if(flog){ oUl.style.display = ‘block‘; flog = !flog; }else{ oUl.style.display = ‘none‘; flog = !flog } }else if(tar.tagName == ‘LI‘){ city.innerHTML = tar.innerHTML; oUl.style.display = ‘none‘; flog = !flog } }
这样我们就分别给Li 和 H1 分别加载了事件,但是我们只是给父集加了事件,这就是事件委托的好处。不需要分别给每个元素添加事件。
标签:加载 网络 整理 play splay win 分发 事件委托 cti
原文地址:http://www.cnblogs.com/my-effort/p/6126452.html