make javascript function saved

Viewed 40

Im using a javascript function to change color on some icons with dataset. i cant find out how i can make the color that i change with a click, to stay that way.

this is the javascript function:

window.onload = oppdater;

function oppdater() {

   const clickHandler = function () {
        this.style.color = 
          this.style.color != this.dataset.activeColor ?
          this.dataset.activeColor :
          this.dataset.disabledColor;
      };
    
    for (const element of document.querySelectorAll(".active-color-aware")) {
      element.onclick = clickHandler;
    }

}
<div>
<img src="img/mug_test.png" height="200px" width="200px">
            <p>fillifjonka grå</p>
            <div id="icon_colors" class="center_icon_text">
            <i data-active-color="green" data-disabled-color="#6080a0" class="fas fa-home fa-3x active-color-aware"></i>
            <i data-active-color="yellow" data-disabled-color="#6080a0" class="fas fa-grin-hearts fa-3x active-color-aware"></i>
            <i data-active-color="red" data-disabled-color="#6080a0" class="fas fa-heart-broken fa-3x active-color-aware"></i>
            </div>  
        </div>

1 Answers

If you want to save the info event after user closes the browser, you can leverage the localstorage

// Save
localStorage.setItem("activeColor", "red");
// Get
var activeColor = localStorage.getItem("activeColor");
Related