javascript - 添加 cookie 后 Jquery 切换不起作用

标签 javascript jquery cookies

试图通过添加 cookie 来维持最后的切换状态 https://github.com/carhartl/jquery-cookie .这是我尝试做的。

<html>
<head>
</head>
<body>
    <p>Lorem ipsum.</p> 
    <button>Toggle</button>
</body>
</html>

然后是 jQuery 和 Javascript

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        if ($.cookie){
            $("p").toggle(!(!!$.cookie("toggle-state")) || $.cookie("toggle-state") === 'true'); 
        }

    $("button").on('click', function(){

    $("p").toggle();
        $.cookie("toggle-state", $("p").is(':visible'), {expires: 1, path:'/'}); 
    });
});
</script>

Fiddle

我希望 cookie 记住开关的最后状态,无论是隐藏还是显示,它已经存在了一天。

不工作。为什么?

最佳答案

您没有关闭您的第一个点击事件,因为错误您的代码将无法正常运行。

$("button").click(function() {

当您关闭它时一切正常:enter image description here

工作代码:

$(document).ready(function() {
    $("button").click(function() {
        if ($.cookie){
            $("p").toggle(!(!!$.cookie("toggle-state")) || $.cookie("toggle-state") === 'true'); 
        }
    });

    $("button").on('click', function() {
        $("p").toggle();
        $.cookie("toggle-state", $("p").is(':visible'), {expires: 1, path:'/'}); 
    });
});

关于javascript - 添加 cookie 后 Jquery 切换不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43888781/

相关文章:

javascript - 制作一个函数来识别单击了哪个按钮

javascript - 如何克隆图像并将其放置在随机位置

javascript - 加载设置值时按名称排列的元素

jQuery UI Sortable - 删除元素后删除占位符

javascript - 使用 blob 解析数组对象

javascript - 如何既保持选择又按下按钮?

javascript - 禁用 cookie,直到用户通过 javascript 接受它们

ios - 解析 XML 数据 objective-c

ASP.NET 网络表单 : set cookie using jQuery on the OnSelectedIndexChanged event

javascript - porto magento 2 demo 1 主题中没有缩放功能