jQuery - 在li中使用cookie设置类“active”

时间:2014-11-26 21:21:54

标签: jquery class cookies

我在使用Cookie在<li>中设置“活动”类时遇到了一些问题。 我正在使用这个库https://github.com/carhartl/jquery-cookie

<UL CLASS="backchange">
    <LI CLASS='background_1' TITLE="White"></LI>
    <LI CLASS='background_2' TITLE="5% Black"></LI>
    <LI CLASS='background_3' TITLE="35% Black"></LI>
    <LI CLASS='background_4' TITLE="80% Black"></LI>
    <LI CLASS='background_5' TITLE="90% Black"></LI>
</UL>
<UL CLASS="patchange">
    <LI CLASS='patchange_1' TITLE="Diagonal line - transparent"></LI>
    <LI CLASS='patchange_2' TITLE="Diamond - transparent"></LI>
    <LI CLASS='patchange_3' TITLE="Dots - transparent"></LI>
    <LI CLASS='patchange_4' TITLE="Squares 1 - transparent"></LI>
    <LI CLASS='patchange_5' TITLE="Squares 2 - transparent"></LI>
    <LI CLASS='patchange_6' TITLE=""></LI>
    <LI CLASS='patchange_7' TITLE=""></LI>
    <LI CLASS='patchange_8' TITLE=""></LI>
    <LI CLASS='patchange_9' TITLE=""></LI>
    <LI CLASS='patchange_10' TITLE=""></LI>
</UL>

我使用了这个jQuery,但它仍然没有用。还有其他解决方案吗?

在“UL backchange”中设置cookie和“激活”类的功能

function setBackCookie() {
    BackCookieVal = $('.backchange li').hasClass('active') ? 'isActive' : 'notActive';
    $.cookie('BackCookieName', BackCookieVal, { path: '/' });    
}

$(document).ready(function () {
    if ($.cookie('BackCookieName') == 'isActive') {
        $('.backchange li').addClass('active');    
    } else {
        $('.backchange li').removeClass('active');
    }
});

$(".backchange li").click(function () {
    $(this).siblings('li').removeClass('active');
    $(this).addClass('active');
    setBackCookie();
});

设置cookie的功能和UL“patchange”中的“活动”类

function setPatCookie() {
    PatCookieVal = $('.patchange li').hasClass('active') ? 'isActive' : 'notActive';
    $.cookie('PatCookieName', PatCookieVal, { path: '/' });    
}

$(document).ready(function () {
    if ($.cookie('PatCookieName') == 'isActive') {
        $('.patchange li').addClass('active');    
    } else {
        $('.patchange li').removeClass('active');
    }
});

$(".patchange li").click(function () {
    $(this).siblings('li').removeClass('active');
    $(this).addClass('active');
    setPatCookie();
});

0 个答案:

没有答案