Question

我正在尝试创建一个日历，您可以点击日期单元格来“划掉”日期。

我是通过显示块js实现这一点并使用cookie来回忆哪个日期单元已被划掉，但我无法弄清楚如何制作它以便它可以在几个块上工作，有人在乎帮忙吗？

WIP

<script type="text/javascript">
name='open';
function toggle(showHideDiv, switchImgTag) {
        var ele = document.getElementById(showHideDiv);
        var imageEle = document.getElementById(switchImgTag);
        if(ele.style.display == "block") {
                ele.style.display = "none";
                createCookie(name,'false',0);
                imageEle.innerHTML = 'Show this window';
        }
        else {
                ele.style.display = "block";
                createCookie(name,'true',0);
                imageEle.innerHTML = 'Hide this window';
        }
}
function readCookie(name) {
    var nameEQ = name + "=";
    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,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
}
function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
}
function checkCookie(name) {
    var x = readCookie(name)
    if (x == 'false') {
        document.getElementById('showHideDiv').style.display = 'none'
        document.getElementById('switchImgTag').innerHTML = 'Show this window';
    } else if (x == 'true') {
        document.getElementById('showHideDiv').style.display = 'block';
        document.getElementById('switchImgTag').innerHTML = 'Hide this window';
    }
}
</script>
<style type="text/css">
body
{
    width: 300px;
}
</style>

<body onload="javascript:checkCookie('open')">
<div id="showHideDiv" style="display:block;">Some hidden content here</div>
<div style="background: #000; width: 100px; height: 100px; float:right;" onclick="toggle('showHideDiv', 'switchImgTag');">click here</div>

</body>

多个Div显示Cookie内存

0 个答案: