我们的志愿者还没有将这篇文章翻译为 中文 (简体)。加入我们帮助完成翻译！
The MouseEvent.relatedTarget read-only property is the secondary target for the event, if there is one. That is:
| Event name | target |
relatedTarget |
| focusin | The EventTarget receiving focus |
The EventTarget losing focus |
| focusout | The EventTarget losing focus |
The EventTarget receiving focus |
| mouseenter | The EventTarget the pointing device entered to |
The EventTarget the pointing device exited from |
| mouseleave | The EventTarget the pointing device exited from |
The EventTarget the pointing device entered to |
| mouseout | The EventTarget the pointing device exited from |
The EventTarget the pointing device entered to |
| mouseover | The EventTarget the pointing device entered to |
The EventTarget the pointing device exited from |
| dragenter | The EventTarget the pointing device entered to |
The EventTarget the pointing device exited from |
| dragexit | The EventTarget the pointing device exited from |
The EventTarget the pointing device entered to |
For events with no secondary target, relatedTarget returns null.
Syntax
var tgt = instanceOfMouseEvent.relatedTarget
Return value
An EventTarget object or null.
Example
<!DOCTYPE html>
<html>
<head>
<style>
div > div {
height: 128px;
width: 128px;
}
#top { background-color: red; }
#bottom { background-color: blue; }
</style>
<script>
function outListener(event) {
console.log("exited " + event.target.id + " for " + event.relatedTarget.id);
}
function overListener(event) {
console.log("entered " + event.target.id + " from " + event.relatedTarget.id);
}
function loadListener() {
var top = document.getElementById("top"),
bottom = document.getElementById("bottom");
top.addEventListener("mouseover", overListener);
top.addEventListener("mouseout", outListener);
bottom.addEventListener("mouseover", overListener);
bottom.addEventListener("mouseout", outListener);
}
</script>
</head>
<body onload="loadListener();">
<div id="outer">
<div id="top"></div>
<div id="bottom"></div>
</div>
</body>
</html>
Specifications
| Specification | Status | Comment |
|---|---|---|
| Document Object Model (DOM) Level 3 Events Specification The definition of 'MouseEvent.relatedTarget' in that specification. |
Working Draft | No change from Document Object Model (DOM) Level 2 Events Specification. |
| Document Object Model (DOM) Level 2 Events Specification The definition of 'MouseEvent.altkey' in that specification. |
Recommendation | Initial definition. |
Browser compatibility
| Feature | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | Not supported | (Yes) | (Yes) | (Yes) | (Yes) |
| Feature | Firefox Mobile (Gecko) | Android | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | ? | ? | ? | ? | ? |