javascript - JS 和 Prototype : mouseover influencing overlying element, 为什么？

Question

我尝试在包含链接的 div 上创建鼠标悬停事件。当鼠标经过 div 时，背景会正确应用于所有 div，但是当鼠标经过链接时，背景只会应用于链接，为什么？

链接 IS 在 div 中，因此从逻辑上讲，它仍然应该在 div 上调用我的事件。

-----------------------------------------------------------
|   |link|                                                |
-----------------------------------------------------------

<div id="a" style="width:100%;">
       <a href="">bob</a>
</div>

<script type="text/javascript">
    $("a").observe('mouseover', function(e) {
            Event.element(e).setStyle({backgroundColor: '#900'});
     });

    $("a").observe('mouseout', function(e) {
                Event.element(e).setStyle({backgroundColor: '#fff'});
    });
</script>

Answer 1

在事件处理程序中使用 this 来一致地引用处理程序绑定(bind)到的 div:

$("a").observe('mouseover', function() {
  this.setStyle({backgroundColor: '#900'});
});

$("a").observe('mouseout', function() {
  this.setStyle({backgroundColor: '#fff'});
});