Issues with storing data locally

Question

Issues with storing data locally

I am currently working on developing a web application where clicking a button saves its ID to local storage and changes its style. However, I am facing an issue where the ID of the last clicked button replaces the ID of the previously clicked button in local storage. Here is a snippet of my code:

$(document).ready(function(){
    $("li a").click(function(){
        $("li a").removeClass('active');
        $(this).addClass('active');
        localStorage.setItem('active', $(this).html())
    });

    var active = localStorage.getItem('active');

    $("li a").each(function(index){
        if($(this).html() == active) {
            $(this).addClass('active');
        }
    });
});

Your help in resolving this issue would be greatly appreciated. Thank you.

javascript jquery css html

Answer 1

Answer №1

localStorage works as a convenient key-value storage system. When you set a key, it will replace the value associated with that key if one already exists. This feature allows for easy manipulation of data stored in localStorage. For instance, you can store an array as a string in localStorage and later retrieve it to make additions or changes.

// Example of storing an array in local storage
localStorage.setItem('myArray', JSON.stringify([1, 2, 3]));

// Retrieve the array, modify it, and then update it in local storage
var myArray = JSON.parse(localStorage.getItem('myArray'));
myArray.push(4);
localStorage.setItem('myArray', JSON.stringify(myArray));

Answer 2

localStorage works as a convenient key-value storage system. When you set a key, it will replace the value associated with that key if one already exists. This feature allows for easy manipulation of data stored in localStorage. For instance, you can store an array as a string in localStorage and later retrieve it to make additions or changes.

// Example of storing an array in local storage
localStorage.setItem('myArray', JSON.stringify([1, 2, 3]));

// Retrieve the array, modify it, and then update it in local storage
var myArray = JSON.parse(localStorage.getItem('myArray'));
myArray.push(4);
localStorage.setItem('myArray', JSON.stringify(myArray));

Issues with storing data locally

Answer №1

Similar questions

"Toggling the parent element through jQuery within a search function

Sending data using Ajax in a Spring application

What is the reason behind CSS absolute positioning consistently being bound to the document body instead of the containing div?

What is the method for adding color to the select and option fields?

Connecting Angular directive to a controller

Angular Material layout uses columns for large displays and switches to rows for smaller ones

scrollbar located outside of the visible content area

Animating the background color using jQuery

The Ajax call is being made twice

Error encountered: $(...).dataTable(...).row does not exist as a function

Having issues with regEX functionality in an Angular form

Retrieve the IDs of list elements in order to dynamically update a div using AJAX

Manipulating events through adjusting values of a JQuery-UI range-slider

Slide containing Ionic list views

Validating Angular for controls that are not in a form

How can I center an image next to text on two lines, that is compatible with IE7?

Evaluating the distances among various points

Incorporating visuals into your HTML email

jQuery is notorious for incorporating front-end JavaScript libraries that are riddled with security flaws

Can FancyBox be applied to a button in Ruby?