jQuery - 单击更改类并通过 cookie 记住答案

【问题标题】：jQuery - Change class on click and remember via cookiejQuery - 单击更改类并通过 cookie 记住
【发布时间】：2010-09-10 06:25:22
【问题描述】：

大家好。我正在尝试设置一个页面，如果您单击链接，课程将发生变化。更进一步，这将必须存储在 cookie 中。每个 A 标签都有一个唯一的 id。

例如，下面是我的示例链接：

<a href="#" id="unique1" class="up">Link text</a>

当用户单击链接时，需要将类更改为“关闭”，并且必须将 cookie 存储一周以记住这次单击。如果之前点击了该链接，那么以后对该页面的任何访问都必须引用 cookie 并相应地设置类。

我对 javascript 和 jQuery 的了解很少。这只是我的头脑。关于如何使这项工作的任何建议？

【问题讨论】：

标签： jquery class cookies

【解决方案1】：

我会使用这个插件来实现这一点：

http://code.google.com/p/cookies/

代码可能是这样的：

    // set default options
    // expires date
    var $todayDate = new Date();
    var $expireDate = ($todayDate.getDate() + 7) + '/' + $todayDate.getMonth() + '/' + $todayDate.getFullYear();

        $.cookies.setOptions({
            expiresAt: $expireDate;
            });


    // click functionality
        $('#unique1').click(function(){

           var $this = $(this);

           $this.removeClass('up').addClass('down');

           var $thisClass = $this.attr("class");

           $.cookies.set('ckClass', $thisClass);

           return false;

        });

要检查 cookie 值并确保该类存在，请使用以下内容：

var $ckVal = $.cookies.get('ckClass');
    if ($ckVal) {
        if ($ckVal == 'up') {
            $('#unique1').attr('class', '').addClass('up');
        } else {
            $('#unique1').attr('class', '').addClass('down');}
    }

【讨论】：

如果您希望在每次点击时更新到期日期，则必须将日期代码移到 click 方法中，并将到期日期添加到选项之一。
这行好像有语法错误：expiresAt: $expireDate;我不太明白是什么导致了这个错误...... Firebug 一直对我大喊警告。
您是否下载并链接到此代码之前的 cookie 插件？

【解决方案2】：

当然，您可以通过单击将类更改为向下。

$(".up").click(function(evt){ $(event.target).removeClass("up").addClass("down"); });

在 JS 中处理 Cookie？ Read up a bit 对此。您基本上希望将唯一 ID 设置为 cookie 中的数组/列表。然后在页面加载时执行此操作。

// list = ['#unique1', '#unique2' ... '#unique-n'];
for(var id in list)
{
    $(id).removeClass("up").addClass("down");
}

【讨论】：

让班级在点击时改变是我的一个可行部分。我真的只是不掌握如何在 cookie 中设置一个数组并将其与上面的 jquery 进行比较。
@Robert：我指向你的链接非常好。您几乎可以逐字使用该脚本来执行此操作。