为什么有时滚动顶部/滚动左不可写

Why sometime scrollTop/scrollLeft not writable?

本文关键字：滚动 顶部 为什么      更新时间：2023-09-26

我正在使用dhtmlx甘特图UI组件，该组件具有任务列表和图形图表。任务列表和图形图表包含在两个单独的div 元素中，这些元素同步以进行并行滚动。通过滚动图表区，任务列表会自动滚动，从而导致任务行位置与甘特线位置匹配。

检查组件源代码，我发现同步是通过以下代码实现的：

this.oData.onscroll = function() {
    self.panelTime.scrollLeft = this.scrollLeft;
    self.panelNames.scrollTop = this.scrollTop;
};

UI 控件中的所有 HTML 标记都由 JavaScript 动态生成。一切都运行良好，除了渲染 800 左右的任务列表需要很长时间。

为了缩短渲染时间，我决定构建自己的服务器端渲染模块，以生成与最初生成的客户端相同的 HTML 标记。这个标记是使用普通的jquery $.get（）从客户端获取的，并使用$（el）.html（）注入到页面。然后，我将必要的事件处理程序作为原始客户端版本。

现在的问题是并行滚动不起作用。我可以捕获图表区域上的滚动事件，但无法设置任务列表区域的 scrollTop 属性。我在Firebug中测试手动强制scrollTop属性，但值没有改变。似乎 scrollTop 属性是只读的。

对此有什么解释吗？

不能向下滚动到元素内容的底部下方（或右侧）。 如果元素具有 overflow: visible（默认值），或者至少与其内容一样大，则两个滚动属性都将停留在 0。 同样，即使隐藏了一些东西可以滚动到视图中，您也无法滚动到末尾;如果将 scrollTop 或 scrollLeft 设置为大于有意义的值，它将减小到有意义的最大值。

我的猜测是，在您的情况下，您尝试在其内容加载之前滚动div，并且它拒绝滚动，因为没有任何内容可以滚动到视图中。

相关文章：