中文(繁体)
只在父級節點中觸發事件在子節點中不會觸發
注意IE和Firefox等瀏覽器中的event.srcElement : e.target是怎麼區別的
點擊運行以下程式碼：
運行演示 <!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> 只在父級div中觸發事件在子div中不觸發</title> <style type="text/css"> div{background:#eee;margin:20px auto;border:1px solid #ccc;} div div{background:# fff;margin:40px;} #ctnr{width:500px;} #hd{height:300px;} #bd{height:200px;} </style> </head> <body> <div id="ctnr"> ctnr 此div容器包含兩個div，<br />但不讓動作發生在其包含的子div裡面，只在父div裡面觸發。 <div id="hd">hd 在這裡無觸發</div> <div id="bd">bd 在這裡無觸發</div> 動作只觸發在空白的地方</div> <script type=" text/javascript"> <!-- function initDrag(e) { var oDragHandle = document.getElementById&&document.all ? event.srcElement : e.target; if(oDragHandle.id == "ctnr"){alert(oDHandle] " clicked.");} } document.onclick=initDrag; //--> </script> </body> </html>
