你的位置:首页 > Java教程

[Java教程]js 事件监听 冒泡事件


js 事件监听  冒泡事件   的取消    

【自己写框架时,才有可能用到】
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>  <head>    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">    <title>事件编程</title>    <style type='text/css'>    #div1 {      width:400px;      height:400px;      background:#ff0000;    }    #div2 {      width:300px;      height:300px;      background:blue;    }    #div3 {      width:200px;      height:200px;      background:yellow;    }    </style>    <script>               //取消事件冒泡      //自己写框架时,才有可能用到      function stopBubble(event) {         if(window.event) {           window.event.cancelBubble = true;          } else {           event.stopPropagation();          }      }      window.onload = function() {        addEvent($('div1'),'click',function(){          alert('div1');        })        addEvent($('div2'),'click',function(event){          alert('div2');          stopBubble(event);        })        addEvent($('div3'),'click',function(event){          alert('div3');          stopBubble(event);        })      }    </script>  </head>  <body>    <div id='div1'>      <div id='div2'>        <div id='div3'></div>      </div>    </div>  </body></html>