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

时间:2019-05-23 13:40:28

标签: javascript json parsing storage stringify

好的,可以说我在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)时发生问题一样?

1 个答案:

答案 0 :(得分: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));

要能够重新使用该对象并更新其其他属性,使用本地存储内容更新两个属性的帮助器功能将是一个很好的解决方案。

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));

最适合您的解决方案取决于您打算如何以及在何处使用该对象。