提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  其他

当前栏目

jsevent事件的传递与冒泡处理

事件 处理 传递 冒泡
2023-06-13 09:14:14 时间
复制代码代码如下:

<div>
<tablenclick="gotClick(event,"table",this)"id="table">
<trnclick="gotClick(event,"tr",this)"id="tr">
<tdnclick="gotClick(event,"td",this)"id="td">
<inputtype="button"name="button"value="单击我"
onclick="gotClick(event,"按钮",this);"id="button">
</td>
</tr>
</table>
</div>
<divid="result">
</div>

js文件
复制代码代码如下:

functiongotClick(event,msg,obj){
varobject;
varmsgs=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;//阻止传递
}
elseif(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=>被单击了!

相关文章