1

我有一个 div 元素，里面有很多内容：

<div id="x" class="unhidden">
    text and more divs
</div>

CSS 类“未隐藏”包含：

display: block;

当我单击一个链接时，元素 id='x' 通过 javascript 变为 class='hidden' 槽，其中包含：

display: none;

div 元素现在被隐藏了。到目前为止，一切都很好。现在我想返回并显示完整div='x'并向下滚动到 div 中的某个 div id='x'。

因此，当我单击后退按钮时，首先该类unhidden再次通过 javascript 变为低谷，然后我在同一函数中运行此脚本：

window.scroll(0, findPos(document.getElementById(GoTo)));

GoTo 是我要向下滚动到的某个 div 的 ID。使用此功能向下滚动：

function findPos(obj) {
    var curtop = 0;
    if (obj.offsetParent) {
       do {
            curtop += obj.offsetTop;
       } while (obj = obj.offsetParent);

       return [curtop];
   }
}

该脚本确实找到了要去的位置，但不会向下滚动。

如果向下滚动脚本与隐藏/未隐藏部分分开，它也可以工作。但是在这里它不起作用，隐藏/显示部分会阻止某些东西。

任何解决方案或想法？

4

1 回答 1

1

我认为这是由于浏览器首先执行了所有 JS 代码，然后才将控制权交还给渲染引擎——因此更改类实际上并没有使元素在计算元素位置的代码处再次可见执行（并且未显示的元素没有任何位置）。

如果您将整个window.scroll调用包装到一个匿名函数中并使用 以最小的延迟执行它setTimeout，那应该可以解决问题：

referenceToDivElement.className = "unhidden";
var targetElement = document.getElementById(GoTo);
window.setTimeout(function() {
  window.scroll(0, findPos(targetElement));
}, 5);
于 2013-03-26T15:44:00.233 回答