Question

我试图用存储在localStorage中的json数组中的项目填充wtform textareafield。每行应有1个值，如下所示：

value1

value2

value3

当我使用for循环获取项目时，仅显示最后一个项目。

value3

任何帮助将不胜感激。

 function getValue() {
    //sets requirements as a json array
      var myinputs = $("[id^=reqInput]").map(function(){
       return this.value;
        }).get();
        localStorage.setItem("reqs", JSON.stringify(myinputs));
        console.log(myinputs);
    // calls arrays and populates criteria form
        for (var i = 0; i < myinputs.length; i++) {
          var reqArray = myinputs[i];
          console.log(reqArray);
          document.getElementById("mission").value = reqArray;
      };
    };

Answer 1

在您的代码中，下面的语句将在每个循环中始终用新值替换以前的值：

document.getElementById("mission").value = reqArray;

如果要将每个值打印在单独的行中，则需要将值附加在#mission上（而不是替换它），并将<br />放在两者之间。

示例：

// empty the element at first
document.getElementById("mission").innerHTML = ""

for (var i = 0; i < myinputs.length; i++) {
    var reqArray = myinputs[i];
    document.getElementById("mission").innerHTML += reqArray + "<br />";
};

Answer 2

我根据Noval Agung Prayogo的反馈进行了以下调整，并且效果很好！

function getValue() {
//sets requirements as a json array
  var myinputs = $("[id^=reqInput]").map(function(){
   return this.value;
    }).get();
    sessionStorage.setItem("reqs", JSON.stringify(myinputs));
    console.log(myinputs);
    document.getElementById("mission").value = ""
    for (var i = 0; i < myinputs.length; i++) {
    var reqArray = myinputs[i];
    document.getElementById("mission").value += reqArray + '\n';
  };
};

javascript for localStorage中json变量的循环仅显示wtform中的最后一项

2 个答案: