点击返回后显示HTML显示的最后状态

我有这个问题我说我单击一个事件（例如单选按钮2）来显示（）div2并隐藏（）div1。之后，我点击一个链接重定向到下一页。点击返回后显示HTML显示的最后状态

然后我点击返回按钮（浏览器< - ）。单选按钮2被选中，但显示器是div1而不是div2。这里是一个示例源代码。任何人都可以帮助我，如果这可以解决。

<!-- 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 -->

来源

2012-09-25 Paengski

你会以某种方式保存状态，无论是服务器端使用Ajax或形式的职位，或通过客户端与饼干或localStorage的。

您可以用jquery-cookie plugin轻松设置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-25 03:25:42 JKirchartz

网络是无国籍，并且默认浏览器不记得的任何设置上一页..所以当你按下后退按钮它就像一个页面刷新像你打开默认页面默认HTML

这是预期和默认行为

如果你想要你期望的行为，那么你需要缓存页面或存储状态，无论是在会话或cookie。

来源

2012-09-25 03:27:46

你可以在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-25 03:29:29 undefined

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-25 03:31:46 Afshin

点击返回后显示HTML显示的最后状态

回答

相关问题