0

我一直在尝试结合两种javascript代码，一种是在打开新的div时关闭其他div，另一种是使用cookie来记住查看器是否打开了div。

现在它成功地记住了哪个 div 是打开的，但是当我单击打开另一个 div 时，它不会关闭第一个 div。如果我再次单击以重新打开第一个 div，它会按预期关闭第二个 div，然后，如果我单击以打开第二个 div，它会按预期关闭第一个 div。然后它工作得很好。但我不知道为什么它不会在初始点击时关闭第一个 div。

我对javascript很陌生，所以我不太了解如何操作它。

<body>
<script language="javascript">
function setCookie (name, value, expires, path, domain, secure) {
    document.cookie = name + "=" + escape(value) +
    ((expires) ? "; expires=" + expires : "") +
    ((path) ? "; path=" + path : "") +
    ((domain) ? "; domain=" + domain : "") +
    ((secure) ? "; secure" : "");
}
function getCookie (name) {
    var cookie = " " + document.cookie;
    var search = " " + name + "=";
    var setStr = null;
    var offset = 0;
    var end = 0;
    if (cookie.length > 0) {
        offset = cookie.indexOf(search);
        if (offset != -1) {
            offset += search.length;
            end = cookie.indexOf(";", offset);
            if (end == -1) {
                end = cookie.length;
            }
            setStr = unescape(cookie.substring(offset, end));
        }
    }
    if (setStr == 'false') {
        setStr = false;
    } 
    if (setStr == 'true') {
        setStr = true;
    }
    if (setStr == 'null') {
        setStr = null;
    }
    return(setStr);
}

function MyFunction2(divName){
    setCookie('bookmark_state', false);
    //hidden val
    var hiddenVal = document.getElementById("tempDivName"); 

    //hide old
    if(hiddenVal.Value != undefined){
        var oldDiv = document.getElementById(hiddenVal.Value); 
        oldDiv.style.display = 'none';
    }

    //show div
        var tempDiv = document.getElementById(divName); 
        tempDiv.style.display = 'block';              

    //save div ID
    hiddenVal.Value = document.getElementById(divName).getAttribute("id");

}

function MyFunction3(divName){
    setCookie('bookmark_state', null);
    //hidden val
    var hiddenVal = document.getElementById("tempDivName"); 

    //hide old
    if(hiddenVal.Value != undefined){
        var oldDiv = document.getElementById(hiddenVal.Value); 
        oldDiv.style.display = 'none';
    }

    //show div
    var tempDiv = document.getElementById(divName); 
    tempDiv.style.display = 'block';              

    //save div ID
    hiddenVal.Value = document.getElementById(divName).getAttribute("id");

}

function checkBookmark() {
    if (getCookie('bookmark_state') == null) { 
        document.getElementById('bookmark').style.display = 'block';
    } 
    if (getCookie('bookmark_state') == false) { 
        document.getElementById('bookmark2').style.display = 'block';
    }  
}

</script>
<input id="tempDivName" type="hidden"/>

<div id="bookmark" style="display:none"><a style="color:black" href="#" OnClick="MyFunction2('bookmark2'); return false;">*</a></div>
<div id="bookmark2" style="display:none"><a style="color:red" href="#" OnClick="MyFunction3('bookmark');">*</a></div>

<script>
    checkBookmark();
</script>
</body>

另外，有没有办法使用单个 cookie 来记住几个div 中的哪一个是打开的（而不是只有两个 div）？

4

1 回答 1

0

是的，只需将打开的 div 的状态存储在一个对象中并通过 JSON 对其进行序列化，例如

var states = {
    "div1": true, // open
    "div2": false // closed
}
setCookie("div_states", JSON.stringify(states));
于 2013-10-11T22:48:05.630 回答