阻止事件触发：使用position：absolute来覆盖另一个div

Question

当有人点击前景中绝对定位的“红色”div时，如何防止“背景”div触发事件？

想要我想：当我点击“红色”div时，我只想要触发此事件，当我点击背景时，我只想将该事件作为背景。

http://jsfiddle.net/XzQRJ/

<div id="wrapper" style="position:relative; width:100px; height:100px; background:grey; overflow:hidden;">
    <div id="div1">test
    </div>            
</div>

CSS

#div1 {
    left:0px;
    top: 0px;
    width: 40px;
    height: 40px;
    position:absolute;
    z-index:10;
    background-color: red;
}

我试着把它修好几个小时，此刻我有点无能为力。

Answer 1

停止传播活动。

var elem = document.getElementById('div1');
elem.addEventListener ('mousedown',  function (e) {
    e.stopPropagation();
    msg(elem);
}, false);

FIDDLE