jquery显示，隐藏，滑动切换与cookie的问题

Issue of jquery show,hide,slidetoggle with cookie

本文关键字：cookie 问题 显示 隐藏 jquery      更新时间：2023-09-26

这是我的HTML 

<!-- this is my link -->
<a href='javascript:void(0);' class='show_hide'>Show Hide</a>
<!-- This is my show hide content -->
<div class='slidingDiv'> ..................Here my content...............</div>

我是Jquery初学者。我只是尝试构建一个滑动条。我在slideToggle()函数中使用parent().next()。因为我需要为每个DIV显示/隐藏.所以我写了这段代码....

$(".show_hide").show();
$(".slidingDiv").hide();
$('.show_hide').click(function () {
   $(this).parent().next().slideToggle();
});

这段代码运行良好。但现在我的问题是我需要饼干在刷新后休息。我写这个代码

var cook= $.cookie('showdiv');
if(cook=='true')
    $(".slidingDiv").show();
else
    $(".slidingDiv").hide();
    $('.show_hide').on('click', function()
    {
            $(this).parent().next().slideToggle('normal', function(){
                $.cookie('showdiv', $(this).is(':visible'));
            });
    });

但是饼干不起作用。请注意，我确定我成功安装了jquery cookie插件。

不幸的是，通过在 cookie 中存储布尔值来检查真还是假，您必须将其作为字符串进行比较作为回报。

您是否检查过控制台.log或提醒您的 cookie 返回？

console.log($.cookie('showdiv'));

我测试和比较了字符串没有问题。

见小提琴

如果发布的是您的 HTML 标记，则必须在没有父级的情况下$(this).next(".slidingDiv")选择器。

法典：

var cook = $.cookie('showdiv');
console.log(cook)
if (cook == 'true') $(".slidingDiv").show();
else $(".slidingDiv").hide();
$('.show_hide').on('click', function () {
    $(this).next(".slidingDiv").slideToggle('normal', function () {
        $.cookie('showdiv', $(this).is(':visible'));
    });
});

演示：http://jsfiddle.net/IrvinDominin/PRDU7/

相关文章：