Comment puis-je supprimer un nom de la classe et en ajouter un nouveau avec jQuery et les cookies?

Comment pouvez-vous supprimer un nom de la classe et de le remplacer par un nouveau?

<style>
    .red {background-color: #FF0000;}
    .green{background-color: #00FF00;}
    .blue {background-color: #0000FF;}
</style>

<body class="red">
    <ul>
        <li><a href="">red</a></li>
        <li><a href="">green</a></li>
        <li><a href="">blue</a></li>
    </ul>
</body>

Dans ce cas, lorsque vous cliquez sur le rouge ou le vert ou le bleu, le corps de la classe nom changera en conséquence. Il va aussi faire un cookie qui permettra d'économiser le choix.

J'ai essayé le jQuery .addClass et ça fonctionne, mais c'est l'ajout d'une classe sur le dessus de l'existant. Aussi je n'arrive pas à enregistrer le cookie.

désolé pour mon mauvais anglais ...

OriginalL'auteur kakkalo | 2009-04-29

  1. 16

    Utilisation:

    $('.red').removeClass('red').addClass('blue');

    Voici le plein code du travail:

    $(function() {
    $("a").click(function() {
        var color = $(this).text();
        $("body").removeClass().addClass(color);
        return false;
    });
});

    Et maintenant, pour le cookie partie

    $(function() {
$("a").click(function() {
var color = $(this).text();
$("body").removeClass().addClass(color);
createCookie("color",color);
return false;
});
if (readCookie("color") != null) {
$("body").removeClass().addClass(readCookie("color"));
}
else {
$("body").removeClass().addClass("red");
}
});
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else
var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for (var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ')
c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0)
return c.substring(nameEQ.length,c.length);
}
return null;
}
function eraseCookie(name) {
createCookie(name,"",-1);
}

    Exemple de travail ici. Un grand merci à QuirksMode pour la pré-faites code de cookies (cookie-cutter code de cookies?)

    j'ai essayé, mais depuis que la valeur du cookie va remplacer un nom de classe sa ne fonctionne pas.
    je vous remercie beaucoup. cela fonctionne parfaitement. maintenant, pour le cookie. est-il un autre moyen de gagner sans cookie plugin
    vous êtes tout simplement la meilleure. je vous remercie beaucoup.

    OriginalL'auteur Russ Cam

  2. 4

    Sans jQuery, vous pouvez le faire avec une ligne aussi simple que:

    document.getElementsByTagName("body")[0].className = "red";

    Cela supprime la classe attribuée à l'élément et de le remplacer par ce que vous voulez.

    Pour les cookies, PPK a quelques méthodes simples pour lire/écrire/effacer les cookies.

    createCookie("mySiteCookie", "red", 7); //Set the cookie to expire in 7 days.
readCookie("mySiteCookie"); //Should yield "red"

    OriginalL'auteur Zack The Human

  3. 1

    Vous aurez également besoin de removeClass.

    OriginalL'auteur Hank Gay