Question

我创建了一个div并使用jquery来隐藏和显示div。当用户点击隐藏时我想隐藏div 5分钟，直到用户再次加载页面。我已经将状态（无论是否隐藏）保存在cookie中。当用户在5分钟内第二次加载页面时，应该隐藏div。我已经尝试了下面的代码，但它无法正常工作。有人可以帮我吗？

<script>
        $(document).ready(function () {
            if (getCookie(hidden) === "yes") {
                $("#divAlert").hide();
                if ($("#Hide").is(":visible")) {
                    $("#Hide").css("visibility", "hidden");
                }

                $("#Show").css("visibility", "visible");
            }


            $("#Hide").click(function () {
                $("#divAlert").hide();
                if ($("#Hide").is(":visible")) {
                    $("#Hide").css("visibility", "hidden");
                }
                setCookie();
                $("#Show").css("visibility", "visible");

            });

            $("#Show").click(function () {
                $("#divAlert").show();

                $("#Hide").css("visibility", "visible");


                if ($("#Show").is(":visible")) {
                    $("#Show").css("visibility", "hidden");
                }
            });           
        });

        function setCookie() {
            var currentDate = new Date();
            document.cookie = "hidden=yes;exppires=" + currentDate.getMinutes() + 1;
        }

        function getCookie(cookiename) {
            var results = document.cookie.match('(^|;) ?' + cookie_name + '=([^;]*)(;|$)');

            if (results)
                return (unescape(results[2]));
            else
                return null;
        }
    </script>

Answer 1

假设您的getCookie()和setCookie()功能正常运行，请执行以下代码：

getCookie(hidden);

应该是：

getCookie("hidden");

如果您查看了javascript错误控制台，您会立即看到此问题，因为这可能是脚本错误。

您的其余代码可以简化为：

    $(document).ready(function () {
        if (getCookie(hidden) === "yes") {
            $("#divAlert").hide();
            $("#Hide").css("visibility", "hidden");
            $("#Show").css("visibility", "visible");
        }


        $("#Hide").click(function () {
            $("#divAlert").hide();
            $(this).css("visibility", "hidden");
            $("#Show").css("visibility", "visible");
            setCookie();

        });

        $("#Show").click(function () {
            $("#divAlert").show();
            $(this).css("visibility", "hidden");
            $("#Hide").css("visibility", "visible");
        });           
    });

Answer 2

在getCookie(cookiename)函数中，它引用的cookie_name应为cookiename。

加载页面时根据cookie值隐藏div

2 个答案: