jquery slideUp/slideDown cookie

jquery slideUp/slideDown cookie

本文关键字：cookie slideDown slideUp jquery      更新时间：2023-09-26

我在我的网站上有一个打开的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;
    }
});

有什么想法，如果这是可能的?

谢谢

应该是这样的，使用你提到的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 });
  }
});

添加cookie只需编辑document.cookie

ex: 

document.cookie="slideState=up";

接下来你只需要阅读文档。

我建议你使用本地存储，它简单有效，它有很好的兼容性

相关文章：