如何删除存储在本地存储中的特定项目？

Question

Values stored inside local storage

{"10":true,"11":true,"16":false}

I want to delete a particular data stored inside local storage eg 10

var checkboxValues = JSON.parse(localStorage.getItem('checkboxValues')) || {};

$.each(checkboxValues, function(key, value) {
                if(value===true) {
                    delete checkboxValues[key];
                    }
                }
            });

I stored all checkboxes id and value during onload, and want to remove those checkboxes id with true value when user submit the form.

With the method used above, I unable to delete the data. Is anything wrong with my code?

Answer 1

before saving json object into the localstorage please convert the json object into string and then store it in localstorage like this

JSON.stringify({"10":true,"11":true,"16":false});

and then where you are parsing things it works correctly, just on saving please convert json object into string here is the updated code

var jsonData = JSON.stringify({"10":true,"11":true,"16":false});
localStorage.setItem('checkboxValues', jsonData);

var checkboxValues = JSON.parse(localStorage.getItem('checkboxValues')) || {};

$.each(checkboxValues, function(key, value) {
    if(value===true) {
        delete checkboxValues[key];
    }
});

here it is showing it working fine https://iamlalit.tinytake.com/sf/MTc1ODUwMl81Nzc4NzMw

Answer 2

In order to delete an item from localStorage you have to use removeItem() function but in your case you actually need to update it. So first so you have to overwrite the existing value. See the code below. Here is a Fiddle

 //set the value for first time suppose localStorage.setItem("checkboxValues", JSON.stringify({ "10": true, "11": true, "16": false })); //get the value and update var checkboxValues = JSON.parse(localStorage.getItem('checkboxValues')) || {}; $.each(checkboxValues, function(key, value) { if (value === true) { delete checkboxValues[key]; } }) //store the updated value back to localStorage localStorage.setItem("checkboxValues", JSON.stringify(checkboxValues)); console.log(JSON.stringify(checkboxValues));//logs {"16":false} console.log(JSON.parse(localStorage.getItem('checkboxValues'))); // logs an object with only one property {16:false}