如何在onScroll回调触发时获取鼠标指针位置？

两种思路的可行性分析： #

1. 在scroll回调中获取鼠标指针位置

可行，但不能直接从scroll事件的参数e中读取clientX/clientY——因为scroll事件的触发场景不止鼠标滚轮（比如拖动滚动条、键盘操作、JS主动调用scroll方法），所以scroll事件对象本身不携带鼠标位置信息。

解决办法是提前通过mousemove事件实时记录鼠标位置，在scroll回调中读取存储好的位置值：

// 全局存储鼠标实时位置
let currentMouseX = 0;
let currentMouseY = 0;

// 监听鼠标移动，更新位置
window.addEventListener('mousemove', (e) => {
  currentMouseX = e.clientX;
  currentMouseY = e.clientY;
});

const handleScroll = () => {
  // 在scroll回调中使用存储的鼠标位置
  console.log("scroll时鼠标位置：", currentMouseX, currentMouseY);
};

2. 主动获取鼠标指针位置（不通过回调）

严格来说没有“完全不依赖回调”的方式，因为浏览器没有提供直接查询当前鼠标位置的原生API。但可以通过提前监听mousemove事件维护一个全局的鼠标位置变量，之后在任何需要的地方（比如scroll触发时、定时任务中）直接读取这个变量，相当于“主动”获取了当前位置——本质和第一种思路的核心逻辑一致，只是调用时机更灵活。

另外补充：如果你的滚动操作确定只由鼠标滚轮触发，可以直接监听wheel事件，它的事件对象会携带完整的鼠标位置信息：

const handleWheel = (e) => {
  console.log("滚轮触发时鼠标位置：", e.clientX, e.clientY);
  // 若需要保留原滚动行为，不要阻止默认事件
};

内容的提问来源于stack exchange，提问作者whitebear