2

これを何と呼ぶか​​はよくわかりませんが、これが私の抽象化された問題です。

前後に移動するとき、なぜ一部のブラウザは何が開いているかを覚えておらず、他のブラウザは覚えているのでしょうか。

例えば、

次の場合：

html

<h2>&raquo; <a href="#" id="clickMe">Click Me</a></h2>
<div id="hiddenContent">
    <h2> Meaty Filler </h2>
    <p>
       Bacon ipsum dolor sit amet deserunt venison dolor meatball laboris short loin dolore capicola prosciutto. Tongue cillum salami, drumstick strip steak do spare ribs ball tip proident short loin ullamco ex tempor. Fugiat labore in ut quis ribeye turducken pig beef. Corned beef ham proident, nisi adipisicing bresaola irure kielbasa pig. T-bone nisi ham hock consequat laborum est exercitation dolor shoulder biltong velit qui sunt. Ut chuck esse short ribs turducken, pork loin id.
    </p>
    <p>
Nulla sunt aute meatloaf drumstick pork. Drumstick deserunt capicola aliqua flank leberkas brisket consectetur. Pork belly meatloaf proident, deserunt tri-tip voluptate aliqua. Commodo minim consequat, shoulder tenderloin eiusmod laborum excepteur flank reprehenderit in.
    </p>
   &raquo; <a href="http://baconipsum.com/">  Get Me Some Bacon</a>
</div>
        ​

javascript / jquery

$('#clickMe').click(function(e) { 
   e.preventDefault();
   $('#hiddenContent').fadeToggle();        
})​

css

#hiddenContent {display: none; border: 1px solid #ccc; background: #fcfcfc; padding: 1em; margin: 2em; border-radius: .25em; box-shadow: 2px 5px 10px #DBDBDB;} 

#hiddenContent:hover { background: #FBFBFB; } 
h2 { font: 1.5em/1.75em Georgia, serif; } 
p { margin: 0 0 1em; font: 1em/1.25em Georgia, serif; text-align: justify; } 
a { color: #444; text-decoration: none;} 
a:hover { text-decoration: underline; color: #222; }​

「GetMeSomeBacon」をクリックして戻るボタンを押すと、クロムとIE8はそれ#hiddenContentが開いていて非表示ではなくなったことを記憶しませんが、Firefoxは記憶します。理想的には、Firefoxの動作を模倣したいのですが、それができるかどうかはわかりません。これは可能ですか？

これは動作していないjsfiddleです。jsfiddleは、ヒットバック時にページを明示的にリロードするため機能しませんが、私の（struts --javaベースの）Webアプリケーションでは、応答を明示的にキャッシュするように設定しました。

4

2 に答える 2

1

そのため、ページに戻ったときにページが読み込まれた後、ページで何が変更されたかをブラウザに記憶させたいようです。Firefoxのページキャッシュは、場合によってはこのように機能しますが、他のブラウザでは信頼できません。

あなたがやりたいのは、コンテンツを再表示するときにURLハッシュ（またはフラグメント）を更新することだと思います。これにより、ブラウザの履歴に新しいエントリが追加されます。

次に、同じページで、ページの読み込み時にハッシュをチェックして、非表示のコンテンツを表示するかどうかを決定します。

$('#clickMe').click(function(e) { 
    e.preventDefault();
    window.location.hash = 'show'
    $('#hiddenContent').fadeToggle();        
})​

また、これを追加します

$(document).ready(function() {
    if(window.location.hash == 'show')
        $('#hiddenContent').show();
});

次に、反撃すると、URLに#showが含まれます。準備ができたら、その値を確認してコンテンツを表示できます。

于 2012-12-06T00:45:13.943 に答える
0

これはブラウザに依存する動作であるため、これは不可能な場合があります（または、少なくとも常に機能することが保証されている方法では）。Firefoxの動作を模倣するために使用できるChromiumおよびIEの設定がある場合がありますが、これらの設定はブラウザーユーザーのドメインであるため、ほとんど制御できません。

この関連する質問も見てください：ブラウザの戻る/進むとjavascript変数が変更されますか？

于 2012-12-05T23:29:34.340 に答える