JS和Prototype：mouseover影响叠加元素，为什么？

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事件处理程序始终如一地引用在div的处理程序绑定到：

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

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