1

要約すると、2ページあります。簡略化すると、これらはこのように表すことができます。

ページ1

<html>
    <a href="page-2.html#section-A">Link to section A</a>
</html>

2ページ

<html>
    <script>        
        // Assume jQuery
        $(document).ready(function(){
            $('#wrapper').append($('<a name="section-A">Here is Section A</a><p>Some more content here.</p>'));
        });
    </script>
    <div id="wrapper"></div>
</html>

これに伴う問題は、そのURLのページ1のリンクをクリックすると、「http://www.mydomain.com/page-2.html#section-A」と表示されますが、アンカーがリンクするコンテンツが続くことです。 toは、DOMがロードされるまで生成されません。これは、URLが最初にロードされることを考えると遅すぎます。

問題が明確でない場合はお知らせください。さらに明確にするよう努めますが、このようなシナリオを機能させる方法について誰かが最初に考えている場合は、お知らせください。

4

1 に答える 1

1

2 番目のページでは、「ready」ハンドラーのコードでページの場所を確認できます。場所に「#wrapper」のようなものが含まれている場合、JavaScript で場所をリセットできます。

$(document).ready(function(){
  $('#wrapper').append($('<a name="section-A">Here is Section A</a><p>Some more content here.</p>'));
  if (document.location.hash === '#wrapper')
    document.location.hash = '#wrapper';
});

これが実際に機能するかどうかを試してみます。:-)

edit OK ここにテストページがあります: http://gutfullofbeer.net/hash1.html

2 つのリンクがあります。1 つはハッシュ (私の場合は「#hello」) を含み、もう 1 つはハッシュを含みません。2 番目のものをクリックすると、ページの下部に「こんにちは」セクションが表示されます。最初のものをクリックすると、同じページに移動しますが、「こんにちは」セクションは表示されません (ブラウザー ウィンドウが非常に巨大でない限り)。

于 2010-03-05T14:41:41.710 に答える