javascript - 如何使用 jquery 隐藏元素取决于 cookie 值？

Question

首先，我需要将 cookie cookiesshow 的值设置为 true，单击按钮后我需要询问 cookiesshow 是否为 true 以及它是否为隐藏元素，然后将 cookiesshow 的值设置为 false 但它不起作用。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
</script>
<script>
$(document).ready(function(){
    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 "";
    }

    if (getCookie("cookiesshow") != false)
    {
        document.cookie = "cookiesshow=true";
    }
    else
    {
        $("#cookiebar").hide();
    }

    $("#cookiebutton").click(function(){
        var cookie = getCookie("cookiesshow");
        console.log(cookie);
        if (cookie == "true") {
            $("#cookiebar").hide(1000);
            document.cookie = "cookiesshow=false";
        }
    })
});
</script>

<div class="cookiebar" id="cookiebar"><span>This web using cookies. If you disagree with using cookies, please leave this page. </span><button class="cookiebutton" id="cookiebutton">Accept cookies</button></div>

Answer 1

当你设置cookie时，所有的cookie都会被保存为字符串。

$(document).ready(function(){
    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 "";
    }

    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 + ";path=/";
    }

    if (getCookie("cookiesshow") !== "false")
    {
        setCookie("cookiesshow",true,3650);
        //document.cookie = "cookiesshow=true";
    }

    $("#cookiebutton").click(function(){
        var cookie = getCookie("cookiesshow");
        console.log(cookie);
        if (cookie === "true") {
            $("#cookiebar").hide(1000);
            setCookie("cookiesshow",false,3650);
            //document.cookie = "cookiesshow=false";
        }
    })
});