Português
O evento só é acionado no nó pai, mas não no nó filho.
Preste atenção na diferença entre event.srcElement : e.target em navegadores como IE e Firefox
Clique para executar o seguinte código:
Execute a demonstração <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http ://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> Somente no nível pai Eventos acionados em div não são acionados em divs filhos</title> <style type="text/css"> div{background:#eee;margin:20px auto;border:1px solid #ccc;} div div{background:# fff;margem:40px;} #ctnr{largura:500px;} #hd{altura:300px;} #bd{altura:200px;} </style> </head> <body> <div id="ctnr"> ctnr Este contêiner div contém dois divs, <br />mas a ação não pode ocorrer no div filho que ele contém e só é acionada no div pai. <div id="hd">hd não é acionado aqui</div> <div id="bd">bd não é acionado aqui</div> A ação só é acionada no espaço em branco</div> <script type =" text/javascript"> <!-- function initDrag(e) { var oDragHandle = document.getElementById&&document.all ? event.srcElement : e.target; id + " clicado.");} } document.onclick=initDrag //--> </script> </body> </html>