検索結果

MouseEvent.relatedTarget

この記事内

Syntax
1. Return value
Example
Specifications
Browser compatibility
See also

この記事はまだボランティアによって日本語に翻訳されていません。ぜひ MDN に参加して翻訳を手伝ってください！

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>

View on JSFiddle

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.

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	?	?	?	?	?

ドキュメントのタグと貢献者

タグ:

このページの貢献者: lanzkron, jrefano, teoli, kscarfone, Jeremie

最終更新者: lanzkron, 2015/11/26 3:44:38