العربية
يتم تشغيل الحدث فقط في العقدة الأصلية ولكن ليس في العقدة الفرعية.
انتبه إلى الفرق بين events.srcElement : e.target في متصفحات مثل IE وFirefox
انقر لتشغيل الكود التالي:
قم بتشغيل العرض التوضيحي <!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 لا يتم تشغيلها في divs الفرعية</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 هذه على قسمين، <br />ولكن لا يُسمح بحدوث الإجراء في القسم الفرعي الذي تحتوي عليه، ويتم تشغيله فقط في القسم الأصلي. <div id="hd">لم يتم تشغيل hd هنا</div> <div id="bd">لم يتم تشغيل bd هنا</div> يتم تشغيل الإجراء فقط في المساحة الفارغة</div> <script type =" text/javascript"> <!-- function initDrag(e) { var oDragHandle = document.getElementById&&document.all ? events.srcElement : e.target; if(oDragHandle.id == "ctnr"){alert(oDragHandle. id + " Clicked.");} } document.onclick=initDrag //--> </script> </body> </html>