我正在尝试查找相对于整个文档的最新更新的当前鼠标位置。我设置了一个滚动事件。
由于此事件不包含鼠标位置，因此我在此滚动事件中嵌套了 mousemove 的另一个事件监听器。
尽管如此，它仍然有效，我面临的问题是，如果用户将指针保持在同一位置并简单地用滚轮滚动，则除非我移动鼠标，否则最新位置不会更新。
我该怎么办？我可以用什么来检测鼠标位置？我想要最简单的答案，因为我正在学习 css 和 js。
这是我的代码:
document.addEventListener('scroll', (e) => {
document.addEventListener('mousemove', (e1) => {
total_scroll = window.scrollY + e1.clientY;
console.log("Current Pos: " + total_scroll);
})
})body {
height: 2000px;
}最佳答案
我认为最好的解决方案是分离这些监听器，并使用当前鼠标位置不断更新某些变量，然后在滚动时 - 只需使用该变量。
我之前的答案不合适，所以我再给出一个:
<html lang="en">
<head>
<title>Document</title>
<style>
body {
height: 2000px;
}
</style>
</head>
<body>
<script>
let clientScrollY = 0;
document.addEventListener('mousemove', (e1) => {
clientScrollY = e1.clientY;
})
document.addEventListener('scroll', (e) => {
total_scroll = window.scrollY + clientScrollY;
console.log("Current Pos: " + total_scroll);
})
</script>
</body>
</html>
如果您想更新 onscroll 和 onmousemove，这里还有解决方案。
<html lang="en">
<head>
<title>Document</title>
<style>
body {
height: 2000px;
}
</style>
</head>
<body>
<script>
let clientScrollY = 0;
let totalScrollY = 0;
function updateTotalScrollY(){
totalScrollY = window.scrollY + clientScrollY;
console.log(totalScrollY);
}
document.addEventListener('mousemove', (e1) => {
clientScrollY = e1.clientY;
updateTotalScrollY();
})
document.addEventListener('scroll', (e) => {
updateTotalScrollY();
})
</script>
</body>
</html>
关于javascript - 滚动时更新鼠标位置，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/67938211/