区分自动浏览器滚动和用户滚动

Question

当您滚动到页面中间然后刷新它时，浏览器会自动滚动到您所在的位置。我需要能够区分这种自动滚动和用户滚动并将不同的事件附加到它们。

我正在使用

window.addEventListener('scroll', function(e) {});

监听滚动事件，但它会在用户滚动和自动滚动中触发。

有没有办法区分两者？

PS 类似问题的建议答案仅使用鼠标滚轮作为用户滚动的指示，但如果用户使用鼠标拉动滚动，它将失败

Answer 1

如果两个事件都有两个标志，那会起作用吗？

不幸的是，我没有鼠标来测试这个。

试试这个fiddle

window.addEventListener( 'load', function() {
    var mousewheel = 0;
    var scroll = 0;

    window.addEventListener( 'scroll', function(e) {
        mousewheel = 0;
        scroll = 1;
        alert("mousewheel: " + mousewheel + ", scroll: " + scroll);
    }, false);

    window.addEventListener("mousewheel", function(e) {
        mousewheel = 1;
        scroll = 0;
        alert("mousewheel: " + mousewheel + ", scroll: " + scroll);
    }, false);

}, false);

Answer 2

正如 Manohar 之前提到的，您可以使用 onscroll event 和 onwheel event 的某种组合。每当与内容交互时，onscroll 都会在所有滚动事件上运行。 onwheel 将在鼠标或触控板滚动上运行，但不会在箭头滚动上运行。还值得一提的是，onwheel 不保证会触发 onscroll 事件，具体取决于上下文。其文档中提供了更多详细信息。

还有另一个类似的问题here 提供了一些关于重新设计应用的额外建议，同时设置一些布尔标志可以帮助确定谁（计算机或真实用户）正在启动滚动。