Question

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

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

当您尝试选择要复制它们的页面元素时，它非常有用，但在执行其他自定义操作时必须阻止该行为。我试图实现的功能是通过拖动鼠标拖动页面的能力，就像在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会解决问题，但事实并非如此。实际上即使鼠标停止移动（当它被拖动到滚动区域之外）时，自动滚动也会继续。

Answer 1

您是否尝试过preventDefault？

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

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

JSFiddle示例：http://jsfiddle.net/nwGaF/1/

HTML5：在拖动过程中防止帮助程序自动滚动功能

1 个答案: