复制代码 代码如下: <div> <table nclick="gotClick(event,'table',this)" id="table"> <tr nclick="gotClick(event,'tr',this)" id="tr"> <td nclick="gotClick(event,'td',this)" id="td"> <input type="button" name="button" value="单击我" onclick="gotClick(event,'按钮',this);" id="button"> </td> </tr> </table> </div> <div id='result'> </div> js文件 复制代码 代码如下: function gotClick(event,msg,obj){ var object; var msgs = msg+" => 被单击了!<br/>"; try{ if (event.target) {//Mozilla object = event.target; // alert(document.getElementById(object.id).nodeName+" Mozilla "+msg); document.getElementById('result').innerHTML +=msgs; // event.cancelBubble=true;//阻止传递 } else if(event.srcElement){//IE object = event.srcElement; // alert(object.id+" IE "+msg); // event.cancelBubble=true;//阻止传递 document.getElementById('result').innerHTML +=msgs; } }catch(e){ alert(e); } } 运行结果是: 按钮 => 被单击了! td => 被单击了! tr => 被单击了! table => 被单击了!

　　推荐阅读

　　jQuery Selectors(选择器)的使用(二、层次篇)

本系列文章分为：基本篇、层次篇、简单篇、内容篇、可见性篇、属性篇、子元素篇、表单篇、表单对象属性篇共9篇文章。 您对本系列文章有任何建议或意见请发送到邮箱：sjzlgt@qq.com 由于是第一次写技术性系列文章，>>>详细阅读

本文标题：js event事件的传递与冒泡处理

地址：http://www.17bianji.com/kaifa2/JS/27566.html

 1/2    1