<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>HelloWorld</title>
<style>
div {
width: 200px;
height: 200px;
border: 1px solid red;
margin-top: 200px;
margin-left: 100px;
}
</style>
</head>
<body>
<div></div>
<br><br>
X轴:<input type="text">
Y轴:<input type="text">
<script>
let div = document.querySelector("div");
let inputs = document.querySelectorAll("input");
let x = inputs[0];
let y = inputs[1];
div.onmousemove = function (ev) {
ev = ev || window.event;
x.value = ev.pageX - this.offsetLeft;
y.value = ev.pageY - this.offsetTop;
};
</script>
</body>
</html>
获取鼠标在盒子中的坐标
最新推荐文章于 2024-08-19 15:50:15 发布