子div点击事件触发父母点击事件

Question

如果点击了子div，我该如何防止发生父级点击事件？

http://jsfiddle.net/2GEKu/

var p = document.getElementById('parent'); 
var c = document.getElementById('child'); 

p.onclick = function() { 
    alert('parent click'); 
} 
c.onclick = function() { 
    alert('child click'); 
} 

Answer 1

调用在孩子的处理程序event对象的.stopPropagation()方法。

var p = document.getElementById('parent'); 
var c = document.getElementById('child'); 

p.onclick = function() { 
    alert('parent click'); 
} 
c.onclick = function (event) { 
    event.stopPropagation(); 
    alert('child click'); 
} 

---

，使其与IE8兼容和较低的，这样做：

c.onclick = function (event) { 
    if (event) 
     event.stopPropagation(); 
    else 
     window.event.cancelBubble = true; 
    alert('child click'); 
}