将鼠标放在div中

Question

将鼠标放在div中

我有一个说100px,100px维度的div,onmousedown我想移动这个div内的一个对象,并希望鼠标不应指向除div之外的任何其他位置,以便我的对象放在div中.鼠标将恢复正常onmouseup.

什么应该是javascript将鼠标只保留在div中？

Answer 1

无法使用 Javascript 控制鼠标位置；但你可以占据他的位置来控制你想要的对象......这里有一个简单的代码几乎可以做到这一点：

<html>
<body>
<div id="divID" style="width: 100px; height: 100px; position: absolute; left: 250px; top: 300px; background: #000"></div>
<div id="divChild" style="width: 20px; height: 20px; color: #f00; position: absolute; background: #f00;"></div>
</body>
<script>
var div = document.getElementById("divID");
var divChild = document.getElementById("divChild");

mousepressed = 0;

function handleMyMouseMove(e) {
    var mouseX = e.clientX;
    var mouseY = e.clientY;
    if(mousepressed) {
        divChild.style.left = mouseX + "px";
        divChild.style.top = mouseY + "px";
    }
}

function handleMyMouseDown(e) { mousepressed = 1; }
function handleMyMouseUp(e) { mousepressed = 0; }

div.addEventListener("mousemove", handleMyMouseMove, false);
div.addEventListener("mousedown", handleMyMouseDown, false);
window.addEventListener("mouseup", handleMyMouseUp, false);
</script>
</html>

Run Code Online (Sandbox Code Playgroud)

归档时间：	14 年，4 月前
查看次数：	8665 次
最近记录：	6 年前