JS和Prototype:鼠标悬停影响覆盖元素,为什么?

时间:2009-11-05 20:57:48

标签: javascript events javascript-events prototypejs

我尝试在包含链接的div上创建一个mouseover事件。当鼠标经过div时,背景将正确应用于所有div,但当鼠标悬停在链接上时,背景仅适用于链接,为什么?

div中的链接 IS ,所以逻辑上它仍然应该在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>

1 个答案:

答案 0 :(得分:2)

在事件处理程序中使用this来始终引用处理程序绑定的div:

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

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