div事件穿透~~~

Question

现有两个DIV  是嵌套关系， 分别都有单击事件，， 单击内层DIV 空白处， 内层DIV的事件未被执行， 外层的DIV 事件被执行了，， 有没有什么好的解决办法

Answer 1

就是说 我要我结果是    单击内层DIV空白处也执行 内层DIV的事件 不执行外层的

Answer 2

<script>
function test(e,a){
e = e || window.event;
if (window.event) {
e.cancelBubble = true;
} else {
e.stopPropagation();
}
if(!a) alert("外");
else{alert("内"); }
}
</script>
<div style="background: #666699;width: 300px;height: 200px;" onclick="test(event)">
    <div onclick="test(event,1)" style="background: #66EE99;width: 100px;height: 80px;">
    </div>
</div>是不是这意思 ？

Answer 3

<div style="width:100px; height:100px; border:1px solid #000" id="x">
<div style="width:50px; height:50px; margin:0 auto; border:1px solid #ccc" id="y"></div>
</div>
<script type="text/javascript">
document.getElementById("x").onclick=function(e)
{
    alert("x")
    e = e || window.event;
　　if (e.stopPropagation )
　　      e.stopPropagation();
　　else
　      　e.cancelBubble = true;
}
document.getElementById("y").onclick=function(e)
{
    alert("y")
   e = e || window.event;
　　if (e.stopPropagation )
　　      e.stopPropagation();
　　else
　      　e.cancelBubble = true;
}
</script>
阻止事件冒泡