如何使用单击功能使用 jQuery 设置/删除 cookie答案

【问题标题】：How to set/remove cookie with jQuery using click function如何使用单击功能使用 jQuery 设置/删除 cookie
【发布时间】：2016-03-14 19:51:30
【问题描述】：

我有一个按钮，可以在每次点击时添加/删除额外的 body 类。我正在尝试使用 jquery-cookie 脚本设置正确的类。这是我的代码：

$(document).ready(function() {
   var body_class = $.cookie('body_class');
   if(body_class) {
       $('body').attr('class', body_class);
   }
   else {
       $.removeCookie('body_class');
   }
   $(".contrast-btn").click(function() {
       $("body").toggleClass("extra-class");
       $.cookie('body_class', $('body').attr('class'));
   });
});

有什么问题？

当我单击开始页面上的按钮并转到子页面时，该类正在移动到所有访问过的子页面 - 这是正确的。当我再次单击按钮（但在子页面上）时，该子页面上的类被删除 - 这也是正确的。问题是当我转到起始页面或其他子页面（我访问过）时，extra-class 已设置但应该被删除。

在控制台上，我有多个具有不同路径名的 cookie。 “第二次”点击后是否可以这样做：

删除extra-class 类
删除所有body_class cookie

【问题讨论】：

$.cookie 是什么？另外，使用$('body').addClass() 而不是attr()
jquery-cookie 脚本中的函数
不开玩笑。也许你可以告诉我们是哪一个。
另外，我猜你不是要在这里引用变量名：$.removeCookie('body_class');
有一个项目叫 jquery.cookie github.com/carhartl/jquery-cookie。在那里你可以找到$.cookie 和$.removeCookie。它们是从外部文件调用的。

标签： javascript jquery cookies

【解决方案1】：

尝试像这样 smoeth：

$(document).ready(function() {
   var body_class = $.cookie('body_class');
   if(body_class) {
       $('body').addClass(body_class);
   }else {
       // We already know this cookie doesn't exists at this point, so instead of trying to remove it,
       // this is where you want to SET it.
       $.cookie('body_class', "extra-class");
   }
   $(".contrast-btn").click(function() {
       $("body").toggleClass("extra-class");
       $.cookie('body_class', "extra-class");
   });
});

【讨论】：