jQuery 将 Cookie 保存在使用"this"的切换列表中

Question

我使用的是我从这个网站上的帖子中拼凑出来的切换列表显示。他们工作得很好，但我希望他们能够保存cookie值。

我已经弄清楚了如何有一个cookie的工作，当你的目标是一个单一的类/项目，如"如果(myCookie ==值){做的东西"。myClass"…}"。但问题是，我使用的是一组列表，这些列表会受到"$(this)"的影响。因此，通过类值来瞄准它们是行不通的，因为它们会使用那个类来瞄准所有东西。有意义吗?cookie需要影响"this"而不是"myClass"。

下面是我为列表拼凑的代码。

// append links to the element directly preceding the element with a class of "toggle"
$(".toggle").prev(".toggleList").append('<a href="#" class="toggleLink" id="collapse"></a>');
// hide all of the elements with a class of 'toggle'
$('.toggle').show();
$('a.toggleLink').click(function() {
    // change the link depending on whether the element is shown or hidden
    if (!$(this).is('.active')) {
        $(this).addClass('active');
        $(this).attr("id" ,"expand");
                    THIS IS WHERE I NEED THE $.COOKIE TO WORK. I NEED IT TO REMEMBER THAT "THIS" IS "EXPANDED" OR THAT THE FOLLOWING LINE IS "COLLAPSED"
    }
    else {
        $(this).removeClass('active'); 
        $(this).attr("id" ,"collapse");
    }
    // toggle the display
    $(this).parent().next('.toggle').toggle();
    return false;
});

只是为了补充这个…我确实了解我们在测试站点的其他地方使用的cookie的基本用法。问题是，我知道如何使用它们的唯一方法就是瞄准它们，就像它们在下面一样…

// cookies
// sidebar state
var sideBar = $.cookie('sideBar');
// Set the user's selection for the left column
if (sideBar == 'collapsed') {
    $('#btnCollapseSidebar').css("visibility" ,"hidden");
    $('#btnExpandSidebar').css("visibility" ,"visible");
    $('#leftCol').css("visibility" ,"hidden");      
    $('#sidebar').css("visibility" ,"hidden");
    $('#rightCol').css("margin" ,"42px 0 0 45px");
};

上面列出的我需要使用它们的方式不能针对单个类，而是针对实际项目("this")。当我尝试通过调整上面的代码来应用它们时，它会影响到我的"。切换"类。"。Toggle"类将在页面上被多次使用，并且需要无限次可用。

Answer 1

使用jQuery Cookie插件实现超级简单。http://www.electrictoolbox.com/jquery-cookies/

var CookieOptions = { expires: 7, path: '/' }
$.cookie("CookieName", "CookieValue", CookieOptions);

获取cookie:

$.cookie("CookieName");