Element.setCapture() - Web APIs 编辑
Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
Call this method during the handling of a mousedown event to retarget all mouse events to this element until the mouse button is released or document.releaseCapture() is called.
element.setPointerCapture instead, from the Pointer Events API.Syntax
element.setCapture(retargetToElement);
retargetToElement- If
true, all events are targeted directly to this element; iffalse, events can also fire at descendants of this element.
Example
In this example, the current mouse coordinates are drawn while you mouse around after clicking and holding down on an element.
<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").textContent
= "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.textContent = `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>
Notes
The element may not be scrolled completely to the top or bottom, depending on the layout of other elements.
Specifications
Based on Internet Explorer's implementation.
Browser compatibility
BCD tables only load in the browser
See also
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论