所谓事件委托起始从名字上就很好理解,那就是自己的事件交给别人去做,也就是将事件委托给别人。

先说说它的优点,比如有很多li元素,我们想为每一个li元素注册一个点击事件,当然你可以挨个元素进行注册,但是如果100或者更多li元素的话,这绝对是海量工作,但是我们如果利用冒泡原理,将事件委托给li元素的父级元素处理,那么无论有多少个li元素,都能够轻松搞定了,事件冒泡可以参阅javascript事件冒泡简单介绍一章节。 

代码示例如下:
   [ Foundation5 ] 运行代码    下载代码
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="https://www.51qianduan.com/" />
<title>51前端</title>
<style type="text/css"> 
ul{
  list-style:none;
}
</style> 
<script type="text/javascript"> 
window.onload=function(){
  var obox=document.getElementById("box");
  var oshow=document.getElementById("show");
  obox.onclick=function(ev){
    var ev=ev||window.event;
    var target=ev.target||ev.srcElement; 
    oshow.innerHTML=target.innerHTML;
  }
}
</script>
</head> 
<body> 
<div id="show"></div>
<ul id="box">
  <li>51前端一</li>
  <li>51前端二</li>
  <li>51前端三</li>
  <li>51前端四</li>
</ul>
</body> 
</html>

代码描述:js事件委托原理,js事件委托原理简单介绍代码



3 4



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: js js代码 js实例 javascript javascript代码 javascript实例 js事件 javascript事件

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到