1

按 F5 后如何保存页面状态。(使用 php 或 javascript)

我有这个页面,如果我按下按钮 1,div 1 就会消失,如果你再次按下 div 1,它会重新出现。按钮 2 具有相同的功能。有什么方法可以让我按下按钮 1(或按钮 2)消失 div,然后如果我按下 F5 继续隐藏 div1(或 div2),??

<input type="submit" id="button1" name="button1" value="ID1"><br/>

    <div id="div1" name="div1"/> 
    <b>Hello1</b><br>
    <img src="pic1.png" height="100px" width="100px" /> 
    </div>
<input type="submit" id="button2" name="button2" value="ID2"><br/>

    <div id="div2" name="div2"/> 
    <b>Hello2</b><br>
    <img src="pic2.png" height="100px" width="100px" /> 
    </div>
<script>
 $(document).ready(function(){
        $("#button1").toggle(function(){
            $("#div1").hide();
        }, 
        function(){
            $("#div1").show();
        });
    });
    //
    $(document).ready(function(){
        $("#button2").toggle(function(){
            $("#div2").hide();
        }, 
        function(){
            $("#div2").show();
        });
    });
</script>

提前致谢

4

3 回答 3

4

那么 Cookies 可以完成保存最后一个状态等的技巧。如果您不确定 html5 在所有浏览器上都可用。

于 2012-10-15T22:25:30.407 回答
2

一种方法是为此使用 HTML5 历史记录。

var state = { div1: true, div2: false };
history.pushState(state, 'Page', 'mypage/10');
于 2012-10-15T22:24:02.873 回答
1

本地存储

当你想在本地保存大量数据时,你还有另一个机会——使用本地存储(从 HTML5 开始)。您可以直接使用 JavaScript 或使用可用的 jQuery 插件之一来完成。

例如,使用 totalStorage:

 var scores = new Array();
scores.push({'name':'A', points:10});
scores.push({'name':'B', points:20});
scores.push({'name':'C', points:0});
$.totalStorage('scores', scores);
于 2013-01-29T13:03:10.253 回答