Element.setCapture()

mousedownイベントの処理中にこのメソッドを呼び出すと、マウスボタンが離されるか、document.releaseCapture()が呼び出されるまで、すべてのマウスイベントをこの要素にリターゲットします。

Warning: このインターフェースにはブラウザ間のサポートはほとんどありませんでした。代わりに、Pointer Events APIからelement.setPointerCaptureを探していました。

シンタックス

element.setCapture(retargetToElement);
retargetToElement
trueの場合、すべてのイベントはこの要素を直接対象とします。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の実装に基づいています。

ブラウザの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
setCapture
非推奨非標準
Chrome 未対応 なしEdge 未対応 12 — 79
補足
未対応 12 — 79
補足
補足 The retargetToElement parameter to Element.setCapture() was introduced in Edge 5.5.
Firefox 完全対応 ありIE 完全対応 5
補足
完全対応 5
補足
補足 The retargetToElement parameter to Element.setCapture() was introduced in Internet Explorer 5.5.
Opera 未対応 なしSafari ? WebView Android 未対応 なしChrome Android 未対応 なしFirefox Android ? Opera Android 未対応 なしSafari iOS ? Samsung Internet Android 未対応 なし

凡例

完全対応  
完全対応
未対応  
未対応
実装状況不明  
実装状況不明
非標準。ブラウザー間の互換性が低い可能性があります。
非標準。ブラウザー間の互換性が低い可能性があります。
非推奨。新しいウェブサイトでは使用しないでください。
非推奨。新しいウェブサイトでは使用しないでください。
実装ノートを参照してください。
実装ノートを参照してください。

関連資料