javascript - 如何禁用滚动功能？

Question

我对“双滚动”有疑问；这是我的应用程序的屏幕:

可以看到，添加表格的空间被滚动条包围了。我只需要滚动功能来放大和缩小我的图表，而不是上下移动它。目前的情况是，如果我运行放大和缩小图表的功能，它也会向上或向下滚动。它制作了这样一个毫无意义的双卷轴。

是否可以只关闭“滚动”功能而不关闭侧边的滚动条？

这是一些代码(我的事件轮)(我正在使用库“MindFusion Diagramming”):

document.addEventListener('wheel', function (e) {
    var zoom = diagram.getZoomFactor();
    zoom -= e.deltaY / 35;
    if(zoom > 70 && zoom < 200 )
    {
        diagram.setZoomFactor(zoom);
    }
    //e.preventDefault();
});

当我取消注释 e.preventDefault () 时，这是一个错误

我的div(内容是一个带滚动条的区域):

<div id="content" style="position: static; width: 1600px; height: 700px;"  >
        <!-- The Overview component is bound to the canvas element below -->
        <div style="position: absolute; right: 120px; width: 200px;
            height: 200px; border: 1px solid #ffffff; background-color: #c0c0c0;">
            <canvas id="overview" width="200" height="200">
            </canvas>
        </div>
    <!-- The Diagram component is bound to the canvas element below -->
    <div style="position: static; width: 100%; height: 100%; overflow: auto;">
        <canvas id="diagram" width="2100" height="2100">
            This page requires a browser that supports HTML 5 Canvas element.
        </canvas>
    </div>
</div>

Answer 1

尝试，

document.addEventListener('wheel', function (e) {
    e.preventDefault();
    var zoom = diagram.getZoomFactor();
    zoom -= e.deltaY / 35;
    if(zoom > 70 && zoom < 200 )
    {
        diagram.setZoomFactor(zoom);
    }
}, { passive : false});

引用:what are passive event listeners