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

标签 javascript jquery html css

我有这个问题假设我单击一个事件(例如单选按钮 2)以显示()div2 和隐藏()div1。之后,我单击一个链接重定向到下一页。

然后我单击后退按钮(浏览器 <-)。选中单选按钮 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 -->

最佳答案

Web 是无状态的,默认情况下浏览器不会记住上一页的任何设置。所以当您按下后退按钮时,就像您打开默认页面一样刷新页面默认 HTML

这是预期的默认行为

如果您想要您期望的行为,那么您需要在 session 或 cookie 中缓存页面或存储状态。

关于javascript - 显示点击返回后HTML显示的最后状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12575766/

相关文章:

javascript - Angular 7 : How to Use croppie or any other cropper

javascript - setInterval 不同间隔之间的性能影响

javascript - 在 Bootstrap 中防止在移动设备上加载带有 hide-md 或 hide-lg 的图像的最佳方法是什么?

javascript - 如何在点击时将每个可选择的 li 设置为不同的颜色? (JQuery 用户界面)

javascript - x-editable 向 AJax POST 数据总量提交额外的 "array"

javascript - 是否有任何免费的 JS 工具提示,可以从外部 html div 内容加载内容?

javascript - 如何从 JavaScript 中的 fetch 返回响应

javascript - 如何更改第一 View 位置

html - 如何使文本环绕表格,就好像它是图像一样

javascript - 禁用元素外部的点击