tableshow/hide记住选择

Question

我是初学者，在我的 php 页面中使用 jscript 到 hide/show table 使用以下代码：

<script type="text/javascript">
function setTable(what){
if(document.getElementById(what).style.display=="none"){
document.getElementById(what).style.display="block";
}
else if(document.getElementById(what).style.display=="block"){
document.getElementById(what).style.display="none";
}
}
</script>

和 display/hide table2 使用：

<a href="#" onclick= "setTable('table2')"><img src="/icons/index.png" width="55" height="55"></a>

我的问题是，在使用此代码时，对于任何浏览器 activity，table 会重置为默认状态。我正在努力启用用户，一旦他们 show/hide table 它应该继续，即使 refresh/or 导航发生在页面内。我知道我应该使用 cookie 但不知道。请有人指导我。谢谢

Answer 1

使用 cookie 存储 table 状态。

<script type="text/javascript">

var tableState = getCookie("table2state");
if (tableState != "") {
    document.getElementById('table2').style.display = tableState;
}

function setTable(what) {
    if (document.getElementById(what).style.display == "none") {
        document.getElementById(what).style.display = "block";
        setCookie(what + 'state', "block", 365);
    } else if (document.getElementById(what).style.display == "block") {
        document.getElementById(what).style.display = "none";
        setCookie(what + 'state', "none", 365);
    }
}

function setCookie(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
    var expires = "expires=" + d.toUTCString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}

function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') c = c.substring(1);
        if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
    }
    return "";
}
</script>

tableshow/hide记住选择

table show/hide remember the selection

php

cookies

jscript