jquery slideUp / slideDown cookie

Question

我的网站上有一个开放的div，一条欢迎消息，其中有一个slideUp / slideDown切换，因此用户可以单击“关闭”并向上滑动div。 但是，每次你登陆这个页面时，它都是打开的......我想对它应用一个cookie，所以如果用户按下slideUp切换，它会添加一个cookie并将其保持在display:none 。

到目前为止，这是我的jQuery代码...我希望使用cookie插件，这可能会使事情变得更容易？

var welcome_active = false;
$('.welcome-container .trigger span').click(function() {
    if (!welcome_active) {
        $('.welcome-container .content').slideUp('slow', function() {});
        $(this).find('span').removeClass('ss-navigatedown');
        $(this).find('em').html('About');
        $(this).find('span').addClass('ss-navigateup');
        welcome_active = true;
        console.log('test');
    } else {
        $('.welcome-container .content').slideDown('slow', function() {});
        $(this).find('span').removeClass('ss-navigateup');
        $(this).find('em').html('Close');
        $(this).find('span').addClass('ss-navigatedown');
        welcome_active = false;
    }
});

任何想法，如果这是可能的？

谢谢

Answer 1

应该是这样的，使用你提到的cookie插件，但如果你不必支持旧的浏览器，你也可以使用本地存储：

var welcome_active = false;
if($.cookie('welcome_active')=='1'){
  $('.welcome-container .content').slideUp('slow', function() {});
  $(this).find('span').removeClass('ss-navigatedown');
  $(this).find('em').html('About');
  $(this).find('span').addClass('ss-navigateup');
  welcome_active = true;
}
$('.welcome-container .trigger span').click(function() {
  if (!welcome_active) {
    $('.welcome-container .content').slideUp('slow', function() {});
    $(this).find('span').removeClass('ss-navigatedown');
    $(this).find('em').html('About');
    $(this).find('span').addClass('ss-navigateup');
    welcome_active = true;
    console.log('test');
    $.cookie('welcome_active', '1', { expires: 7 });
  } else {
    $('.welcome-container .content').slideDown('slow', function() {});
    $(this).find('span').removeClass('ss-navigateup');
    $(this).find('em').html('Close');
    $(this).find('span').addClass('ss-navigatedown');
    welcome_active = false;
    $.cookie('welcome_active', '0', { expires: 7 });
  }
});

Answer 2

您只需编辑document.cookie即可添加cookie

例如：

document.cookie="slideState=up";

接下来，您只需阅读document.cookie并解析字符串即可获得您的价值。

我建议你使用localstorage它简单而有效，并且它具有非常好的兼容性