0

イベント (ラジオ ボタン 2 など) をクリックして show() div2 と hide() div1 を実行すると、この問題が発生します。その後、リンクをクリックして次のページにリダイレクトします。

次に、戻るボタンをクリックします（ブラウザ<-）。ラジオボタン 2 はチェックされていますが、表示は div2 ではなく div1 です。サンプルのソースコードを次に示します。これを修正できれば、誰でも助けてくれますか。

<!-- test.php START -->
<div id="div_1" style="display: block;">
    <p>First Paragraph</p>
</div>
<div id="div_2" style="display: none;">
    <p>Second Paragraph</p>
</div>


<div>
    <input type="radio" id="rdo1" name="radio" checked/>First
    <input type="radio" id="rdo2" name="radio" />Second
</div>

<div>
    <a href="test1.php">Just to reload the page or go to other page</a>
</div>

<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script> 
<script>
    $(document).ready(function() {
        $("#rdo1").click(function () {

            $("#div_1").show();
            $("#div_2").hide();
        });

        $("#rdo2").click(function () {
            $("#div_1").hide();
            console.log('test');
            $("#div_2").show();
        });
    });
</script>
<!-- test.php END-->

<!-- test1.php START -->
 DISPLAY SOMETHING
<!-- test1.php END -->
4

4 に答える 4

2

Web はステートレスであり、デフォルトではブラウザは前のページの設定を記憶していません。したがって、戻るボタンを押すと、デフォルトの HTML でデフォルトのページを開いたときのようにページが更新されます。

これは予期されるデフォルトの動作です

期待どおりの動作が必要な場合は、ページをキャッシュするか、状態をセッションまたは Cookie に保存する必要があります。

于 2012-09-25T03:27:46.240 に答える
1

サーバー側でajaxまたはフォーム投稿を使用するか、クライアント側でCookieまたはlocalStorageを使用して、何らかの方法で状態を保存する必要があります。

jquery-cookie プラグインを使用して Cookie を簡単に設定するか、バニラ JavaScript を使用して、次の簡単な例のように localStorage を設定できます。

<!doctype html>
<meta charset="utf-8">
<title>html5 notepad</title>
<textarea></textarea>
<script>
var n = document.getElementsByTagName('textarea')[0];
n.onchange = function(){localStorage.setItem("n",n.value);}
n.value = localStorage.getItem("n");
</script>
于 2012-09-25T03:25:42.117 に答える
1

DOMReady で、どのラジオ入力が選択されているかを確認できます。

$(document).ready(function() {
       var ind = $('input[name=radio]:checked').index();
       $('div[id^=div]').hide().eq(ind).show()

        $("#rdo1").click(function () {  
            $("#div_1").show();
            $("#div_2").hide();
        });

        $("#rdo2").click(function () {
            $("#div_1").hide();
            console.log('test');
            $("#div_2").show();
        });
})
于 2012-09-25T03:29:29.000 に答える
0 
if ($('#rdo1').attr('checked')){
         $("#div_1").show();
         $("#div_2").hide();
}
if ($('#rdo2').attr('checked')){
         $("#div_1").hide();
         $("#div_2").show();
}

 $("#rdo1").click(function () {

    $("#div_1").show();
    $("#div_2").hide();
});

$("#rdo2").click(function () {
    $("#div_1").hide();
    console.log('test');
    $("#div_2").show();
});​
于 2012-09-25T03:31:46.237 に答える