首页 > 解决方案 > 在特定位置添加新项目,但无法删除该位置的旧项目

问题描述

嗨,我想在特定位置添加项目并在该位置添加其他项目。我有这个 JSON

键:user_login_users
姓氏:“史密斯”
名称:“帕特里克”

现在我想要延迟 patrick smith 并设置新项目。我的 HTML 代码:

//for delate particular position
var get_delate_position= JSON.parse(localStorage.getItem("user_login_users"));
var new_delate_position = storedNames.slice(pos+1,get_delate_position.length);
localStorage.setItem("user_login_users", JSON.stringify(arr1));

var arr1=JSON.parse(localStorage.getItem("user_login_users"));
arr1[pos].name=nome_users.value;
arr1[pos].surname=cognome_users.value;  
localStorage.setItem("nome_users", arr1[pos].name);
localStorage.setItem("surname_users", arr1[pos].surname);
var t={
    name:arr1[pos].name,
    surname:arr1[pos].surname
    }
arr1.push(t);
localStorage.setItem("user_login_users", JSON.stringify(arr1));

本地存储在此内存中添加一个新位置,设置新项目但不删除旧项目 patrick smith。为什么?我该怎么办?

标签: javascripthtmlcss

解决方案


这与您昨天的问题相似,适用相同的规则。

  1. 通过调用从本地存储中获取最新值localstorage.getItem
  2. 应用您的更改;无论是新项目、删除现有项目还是更改现有项目。没关系。
  3. 通过调用再次保持更改localstorage.setItem

请参阅下面的示例,您可以在这里尝试
它有一个添加、删除和更改现有条目的示例。

// Setup localstorage for this example: 
localStorage.setItem("user_login_users", JSON.stringify([{
  name: "Elena",
  surname: "Rondina"
}, {
  name: "Lars",
  surname: "Codemonkey"
}]));

// adding a new user
// Retrieve the user_login_users from local storage
var usersInLocalStorageAdd = JSON.parse(localStorage.getItem("user_login_users") || []);
console.log("before doing add:", usersInLocalStorageAdd)
// add the user to the object
usersInLocalStorageAdd.push({
  name: "Jacky",
  surname: "Chan"
});
// persist the change to local storage
localStorage.setItem("user_login_users", JSON.stringify(usersInLocalStorageAdd));
// the new user is new persisted
// the user at pos is now deleted:
var afterAdd = JSON.parse(localStorage.getItem("user_login_users") || []);
console.log("after add:", afterAdd)


// Deleting an entry:
// Retrieve the user_login_users from local storage
var usersInLocalStorageDelete = JSON.parse(localStorage.getItem("user_login_users") || []);
console.log("before doing delete:", usersInLocalStorageDelete)

// remove a single user from local storage, at the specified postion:
var pos = 0;
if (usersInLocalStorageDelete.length > pos + 1) {
  usersInLocalStorageDelete.splice(pos, 1);
  localStorage.setItem("user_login_users", JSON.stringify(usersInLocalStorageDelete));

  // the user at pos is now deleted:
  var afterDelete = JSON.parse(localStorage.getItem("user_login_users") || []);
  console.log("after delete:", afterDelete)
}


// Modify existing user:
// Retrive the value from local storage again. 
var usersInLocalStorageForModification = JSON.parse(localStorage.getItem("user_login_users") || []);
console.log('before change', usersInLocalStorageForModification)
// we setup some values we want to apply
var nome_users = {
  value: "John"
};
var cognome_users = {
  value: "Smith"
};
// // pos is still zero. we will edit the first first entry.
usersInLocalStorageForModification[pos].name = nome_users.value;
usersInLocalStorageForModification[pos].surname = cognome_users.value;
// at this point the entry is modified. we need to store it again in order to persist this.
localStorage.setItem("user_login_users", JSON.stringify(usersInLocalStorageForModification));

// the user at pos is now changed:
var afterModify = JSON.parse(localStorage.getItem("user_login_users") || []);
console.log("after change:", afterModify)

推荐阅读