Javascript HTML5：在拖动过程中防止助手自动滚动功能

很难在互联网上搜索有关这种行为的信息，因为我不知道与之相关的术语。我会尽力描述它

这是几乎所有支持滚动的浏览器元素中通常发生的行为：如果单击鼠标，然后在按住按钮的同时将其拖动到滚动区域之外，它将自动水平或垂直滚动到您退出的方向

当您试图选择页面元素来复制它们时，这非常有用，但在执行其他自定义操作时必须防止这种行为。我尝试实现的功能是通过拖动鼠标来拖动页面，这与PDF查看器中的抓取鼠标工具非常相似。它用最少的代码工作得很好，但我不知道如何在鼠标离开可滚动区域后禁用此帮助程序自动滚动

    $("#scroll_area").on('mousedown', function (e) {
        startPos.x = e.clientX;
        startPos.y = e.clientY; 
        drag = true;
    });
    $(document).on('mousemove', function (e) {
        if (drag) {
            // find relative mouse motion
            var diffX = e.clientX - startPos.x;
            var diffY = e.clientY - startPos.y;
            // scroll our body by the relative amount. 
            document.body.scrollTop -= diffY;
            document.body.scrollLeft -= diffX;
            startPos.x = e.clientX;
            startPos.y = e.clientY; // continue updating
            return false; // if dragging do not perform regular things
        }
    });
    $(document).on('mouseup', function (e) {
        // clean up the drag no matter where you let go of the mouse.
        // don't bother evaluating motion here. 
        drag = false;
    });

---

我希望返回false可以解决问题，但事实并非如此。事实上，即使鼠标停止移动（当鼠标被拖动到滚动区域之外时），自动滚动仍会继续。

您是否尝试过默认设置

$("#scroll_area").on('mousedown', function (e) {
    e.preventDefault();
});

这将阻止页面上的所有拖动。然后，您可以实现您希望在拖动时实现的功能

---

jsidle示例：

您是否尝试过禁用选择行为？请看，我已将此添加到我的mousemove回调的开头。仍然没有改变行为。它确实应该这样做，但就是不起作用。尝试将它添加到#滚动#区域。它无论如何都应该传播，但只是为了确保。如果这样做有效的话，我会尝试的下一件事是使用

mousedown

上的

preventDefault（）

确保所有调用都按预期进行（控制台日志+警报）。你应该编辑你的答案，我接受。这很奇怪，因为你在小提琴中使用了

mousedown

，但没有在答案中使用。对不起，这很混乱，在复制答案时弄糟了。