Changer la class de deux balise <a> après avoir actualiser la page

CedLP
Javascript

Bonjour à tous,

dite j'aimerai echanger la class de deux balise après le click.

$(document).on('click', '#gb', function () {
    if (document.getElementById('gb').className === 'flag-icon flag-icon-gb')
    {
        $('#fr').addClass('flag-icon flag-icon-gb');
        $('#gb').addClass('flag-icon flag-icon-fr');

    }else
        if (document.getElementById('gb').className === 'flag-icon flag-icon-fr')
    {
        $('#fr').addClass('flag-icon flag-icon-fr');
        $('#gb').addClass('flag-icon flag-icon-gb');
    }
});

Voici mon code, si la page ne se recharge pas tous marche bien mais, mais une fois la page recharger les class reprennent leur place.
Quelqu'un saurai t'il par hasard comment on fait pour que le changement reste là même après rechargement de la page?

Merci d'avance

3 réponses

Pandazaur
Réponse acceptée

Bonjour,

Lorsque tu recharches ta page, tout ton javascript est réinitialisé, tout est perdu pour être recréé.
Ce que tu peux faire c'est utiliser le localStorage ou sessionStorage afin de sauvegarder les liens sur lesquels tu as cliqué:

par exemple:

window.sessionStorge.setItem('linked_clicked', 'flag-icon-gb')

Une fois que tu recharges ta page:

let link = window.sessionStorage.getItem('linked_clicked')

dans ta variable tu auras la valeur récupérée du storage.

https://developer.mozilla.org/fr/docs/Web/API/Window/localStorage
https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

CedLP
Auteur

Merci Pandazaur, je te ferai un retour d'ici peu

CedLP
Auteur

Salut Pandazaur, bon j'ai essayé ce que tu m'a dis ça a falli être cela mais le fait est que il garde toujours les changement en session du coup ça bouffe de la memoire et ja'ai laissé mais n'empeche tu m'a appris de nouvelle chose et je t'en remercie.
Je marque résolus