1

たくさんのコンテンツを含むdiv要素があります：

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

CSSクラス「unhidden」には次のものが含まれます。

display: block;

リンクをクリックすると、要素id='x'はclass='hidden'トラフjavascriptになります。これには次のものが含まれます。

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 に答える