jQuery阻止事件冒泡

来源:互联网 发布:linux卸载jdk1.5 编辑:程序博客网 时间:2024/05/17 07:36
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>jQuery case-2</title><style type="text/css">  #d1{    width:300px;    height:300px;    background-color:red;    margin:10px auto;    position:relative;  }  #d2{    width:200px;    height:200px;    background-color:blue;    position:absolute;    top:50px;    left:50px;  }  /*父元素已经定位了,则以父元素为参照物 */  #d3{    width:100px;    height:100px;    background-color:yellow;    position:absolute;    top:50px;    left:50px;  }</style><script type="text/javascript" src="../js/jquery-1.11.1.js"></script><script type="text/javascript">  /*          点击父、子元素时弹出提示信息          点击子元素时取消事件冒泡  */  $(function(){$("div").click(function(e){  //获取事件源  var info = $(this).html();  //取消事件冒泡  e.stopPropagation();  console.log(info);  console.log(e.target);//事件源<div id="d3">div3</div>  });  });</script></head><body>  <div id="d1">div1    <div id="d2">div2      <div id="d3">div3</div>    </div>  </div></body></html>

0 0