在 sessionStorage.setitem 中存储值时仅获取最后输入的值答案

【问题标题】：Only getting the last entered value when storing a value in sessionStorage.setitem在 sessionStorage.setitem 中存储值时仅获取最后输入的值
【发布时间】：2019-10-10 02:35:05
【问题描述】：

好吧，假设我在我的 HTML 页面中输入了这两个值：20、30。

我有这两个变量，我从我的 HTML 页面获取值，它工作正常，所以 BrugerFugt=20 和 BrugerTemp=30：

    BrugerFugt = document.getElementById("40").value;
    BrugerTemp = document.getElementById("41").value;

然后我把这两个变量和 setItem 一起使用。

    sessionStorage.setItem("BF", JSON.stringify(BrugerFugt));
    sessionStorage.setItem("BT", JSON.stringify(BrugerTemp));

此时如果我使用 console.log(JSON.stringify(BrugerFugt))，它应该打印 20。

现在我想把它发送到我的服务器，所以我调用这个变量：

  serverConnection.send(JSON.stringify(SetBruger));

我已经定义了这个变量，我要发送到我的服务器。

var SetBruger = {
    command: "BrugerIndtastTF",
    brugerT: sessionStorage.getItem("BT"),
    brugerF: sessionStorage.getItem("BF")
}

然后我尝试打印我的 JSON.stringify(SetBruger)，但它打印的是我在 HTML 网络上输入的最后一个值，而不是新值。假设在我输入 20 和 30 之前，我输入了 40 和 60 之类的东西。然后当我在输入 20 和 30 之后打印我的 SetBruger 时，我在终端中得到了这个打印。

test: {"command":"BrugerIndtastTF","brugerT":"\"40\"","brugerF":"\"60\""}

好像问题出现了，当我 JSON.stringify(SetBruger) 时？

【问题讨论】：

所有这些事情在您的程序流程中的何处/何时发生？比如，你有没有可能在把那个东西发送到服务器之前不调用 setStorage ？或者，您可能在某处创建了 SetBruger 变量，并期望它稍后会自动更新（它不会）。

标签： javascript json parsing storage stringify

【解决方案1】：

您的对象属性是在创建对象时设置的。

var SetBruger = {
    command: "BrugerIndtastTF",
    brugerT: sessionStorage.getItem("BT"), // set when object is created
    brugerF: sessionStorage.getItem("BF") // set when object is created
}

您可以使用帮助函数包装该对象，该辅助函数会在返回之前更新对象，或者将其替换为返回带有 sessionStorage 值的新创建对象的函数，如下所示：

function SetBruger() {
  return {
    command: "BrugerIndtastTF",
    brugerT: sessionStorage.getItem("BT"),
    brugerF: sessionStorage.getItem("BF")
  }
}
serverConnection.send(JSON.stringify(SetBruger));

为了能够重用该对象并更新它的其他属性，使用 localstorage 的内容更新这两个属性的辅助函数将是一个很好的解决方案。

var SetBruger = {
    command: "BrugerIndtastTF",
    brugerT: sessionStorage.getItem("BT"), // set when object is created
    brugerF: sessionStorage.getItem("BF") // set when object is created
}

// Other code that maybe modify the object

function updateBrugerObject() {
    SetBruger.brugerT = sessionStorage.getItem("BT");
    SetBruger.brugerF = sessionStorage.getItem("BF");
}

updateBrugerObject();
serverConnection.send(JSON.stringify(SetBruger));

什么是最适合您的解决方案，取决于您计划使用该对象的方式和位置。

【讨论】：