mousedownイベントの処理中にこのメソッドを呼び出すと、マウスボタンが離されるか、document.releaseCapture()が呼び出されるまで、すべてのマウスイベントをこの要素にリターゲットします。
Warning: このインターフェースにはブラウザ間のサポートはほとんどありませんでした。代わりに、Pointer Events APIから
element.setPointerCaptureを探していました。シンタックス
element.setCapture(retargetToElement);
retargetToElementtrueの場合、すべてのイベントはこの要素を直接対象とします。falseの場合、イベントはこの要素の子孫でも発生する可能性があります。
例
この例では、現在のマウスの座標が、要素をクリックして押した後にマウスを移動しながら描画されます。
<html>
<head>
<title>Mouse Capture Example</title>
<style type="text/css">
#myButton {
border: solid black 1px;
color: black;
padding: 2px;
box-shadow: black 2px 2px;
}
</style>
<script type="text/javascript">
function init() {
var btn = document.getElementById("myButton");
if (btn.setCapture) {
btn.addEventListener("mousedown", mouseDown, false);
btn.addEventListener("mouseup", mouseUp, false);
} else {
document.getElementById("output").innerHTML
= "Sorry, there appears to be no setCapture support on this browser";
}
}
function mouseDown(e) {
e.target.setCapture();
e.target.addEventListener("mousemove", mouseMoved, false);
}
function mouseUp(e) {
e.target.removeEventListener("mousemove", mouseMoved, false);
}
function mouseMoved(e) {
var output = document.getElementById("output");
output.innerHTML = "Position: " + e.clientX + ", " + e.clientY;
}
</script>
</head>
<body onload="init()">
<p>This is an example of how to use mouse capture on elements in Gecko 2.0.</p>
<p><a id="myButton" href="#">Test Me</a></p>
<div id="output">No events yet</div>
</body>
</html>
注意
要素は、他の要素のレイアウトに応じて、上または下に完全にスクロールすることはできません。
指定
Internet Explorerの実装に基づいています。
ブラウザの互換性
このページの互換表は、構造化データから生成されます。 データに貢献したい場合は、https://github.com/mdn/browser-compat-dataをチェックし、プルリクエストを送信してください。
Update compatibility data on GitHub
| デスクトップ | モバイル | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
setCapture | Chrome 未対応 なし | Edge
未対応
12 — 79
| Firefox 完全対応 あり | IE
完全対応
5
| Opera 未対応 なし | Safari ? | WebView Android 未対応 なし | Chrome Android 未対応 なし | Firefox Android ? | Opera Android 未対応 なし | Safari iOS ? | Samsung Internet Android 未対応 なし |
凡例
- 完全対応
- 完全対応
- 未対応
- 未対応
- 実装状況不明
- 実装状況不明
- 非標準。ブラウザー間の互換性が低い可能性があります。
- 非標準。ブラウザー間の互換性が低い可能性があります。
- 非推奨。新しいウェブサイトでは使用しないでください。
- 非推奨。新しいウェブサイトでは使用しないでください。
- 実装ノートを参照してください。
- 実装ノートを参照してください。