scrollIntoView() 在控制台中有效，但在站点代码中无效

Question

我有一个 div，其中包含网站导航中的选项卡表格。我将 div 设置为在移动设备中溢出，如下所示：

我想让 div 自动滚动到当前隐藏的活动选项卡，如下所示：

在另一个 SA 问题中，建议使用scrollIntoView. 在控制台测试了一下，效果很好：

document.getElementById("active_tab").scrollIntoView({block: "end"})

我什至使用了 jQuery 版本scrollintoview：

$('#active_tab').scrollintoview();

而且效果很好。问题是，当我将实际代码（任一代码）添加到我的网站时，溢出 div 会滚动一些随机量（似乎是一半）。这是一个例子：

在 Chrome 和 Safari 中尝试过此操作。我错过了一些明显的东西吗？我并不是想滚动整个页面 - 只是那个隐藏了溢出的 div 。非常奇怪的是，它直接在控制台中工作，但不能直接在我的代码中工作，并且对于 JS 和 JQ 都是如此。据我所知，没有其他 JS 等与此 div 等相关。

Answer 1

如果没有亲眼目睹，很难判断发生了什么（你能链接到实时网站或制作 jsfiddle 演示吗？），但我会做出一个合格的猜测；

当以编程方式发生滚动时，菜单可能尚未完全完成渲染。也许图标或通知尚未显示，因此它会在较短的菜单上向右滚动，然后随着内容加载而变宽。

您可以通过调用 a 中的代码来测试是否是这种情况setTimeout

编辑

调用setTimeout(fn, 0)将立即运行fn，但要排队。由于这似乎已经修复了您的问题，这意味着其他一些任务已经排队但尚未完全运行，但会影响导航栏的宽度。

然而，如果没有亲眼目睹代码运行，就不可能准确地说出这一点。要找出自己，您可以使用排除法：

例如，尝试再次删除setTimeout，然后删除图标，看看会发生什么。如果问题仍然存在，请尝试重新添加图标并删除通知号码等。