localStorage-删除本地|基于密钥的存储值

时间:2018-08-11 09:14:44

标签: javascript jquery arrays local-storage

我在删除localStorage json数据时遇到了一些问题。我已经以JSON格式传递了数据,并且想在点击事件中基于ID删除值。例如,在JSON数组中,如果我有三个具有相同ID的条目,则想一次删除三个。

这是我的代码

 <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {

var feed = {"proid":"2","canvas":"abc"};

a = JSON.parse(localStorage.getItem('names')) || [];

names = JSON.stringify(feed);

a.push(names);

localStorage.setItem('names', JSON.stringify(a));

var obj = "["+a+"]"; 

localStorage.setItem("productidf", obj);

$('#delete-item').click(function(){

var jsonprodId = localStorage.getItem("productidf"); 

  var parsedJSON =  $.parseJSON(jsonprodId);
  var id = 2;

for(var i = 0; i < parsedJSON.length; i++){
  if(parsedJSON[i].proid == id){
     localStorage.removeItem(parsedJSON[i]);
  }
}

localStorage.setItem("productidf", JSON.stringify(parsedJSON));
var newss = localStorage.getItem("productidf");

console.log(newss);
});
});




</script>

<a class="clicks" id="delete-item">Delete Items</a>

此代码无法从本地存储中删除所有id值。我不能使用localStorage.clear()。因为它清除了所有本地存储。

1 个答案:

答案 0 :(得分:0)

您的localStorage.removeItem(parsedJSON[i]);行是罪魁祸首。 localstorage不能像数组一样遍历。它只是以字符串格式存储数据。

因此,您需要使用js parsedJSON过滤filter数组,然后将结果存储回localStorage

<script type="text/javascript" src="http://code.jquery.com/jquery-

latest.min.js"></script>

<script type="text/javascript">
var feed = {"proid":"2","canvas":"abc"};
var feed2={"proid":"3","canvas":"jack"}

a = JSON.parse(localStorage.getItem('names')) || [];
a.push(feed);
a.push(feed2);

localStorage.setItem('names', JSON.stringify(a));


localStorage.setItem("productidf", JSON.stringify(a));
var jsonprodId = localStorage.getItem("productidf"); 

  var parsedJSON =  $.parseJSON(jsonprodId);
  var id = 2;

parsedJSON=parsedJSON.filter((obj)=>{
   return obj.proid != id;
})

debugger
var obj = JSON.stringify(parsedJSON);
localStorage.setItem("productidf", obj);
console.log(parsedJSON);

</script>