JS 및 프로토 타입 : 위에있는 요소에 영향을 미치는 마우스 오버, 왜?
-
18-09-2019 - |
문제
나는 div wich containt a 링크에서 마우스 오버 이벤트를 만들려고 노력합니다. 마우스가 div 위로 통과하면 배경이 모든 div에 올바르게 적용되지만 마우스가 링크 위에 있으면 배경이 링크에만 적용되는 이유는 무엇입니까?
링크 이다 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>
해결책
사용 this
이벤트 핸들러 내부에서 핸들러가 다음에 묶인 DIV를 지속적으로 참조합니다.
$("a").observe('mouseover', function() {
this.setStyle({backgroundColor: '#900'});
});
$("a").observe('mouseout', function() {
this.setStyle({backgroundColor: '#fff'});
});
제휴하지 않습니다 StackOverflow