Question

我在学校有一个项目。该项目旨在创建一个Web表单，用户可以在其中选择一个活动，然后继续填写他们的个人信息。然后，必须在管理员页面上打印此信息，您应该能够在给定活动下查看有关该特定人员的所有信息，具体取决于他们的选择。

我正在努力的是如何通过<select> <option>标记获取他们选择的活动以显示在local.storage中。因为我不知道他们会选择什么。

我创建了一个名为sportVal()的onsubmit函数。我不能通过在我的JS中使用这样的东西来获取信息吗？：

function sportVal() {
  var sportVal = document.getElementById("sportList").value;
  localStorage.setItem("sportList");
}

<form onsubmit="sportVal()" name="frmDataEntry" action="Uppgifter.html" method="POST">
  <select id="sportList">
        <option id="Tennis" value="Tennis">Tennis</option> 
        <option id="Fotboll" value="Fotboll">Fotboll</option> 
     </select>
  </br>
  <input id="Knapp" type="submit" value="Gå vidare >>" />
</form>

Answer 1

使用localStorage.getItem（“sportList”），您尝试返回已存储在存储中的名为“sportList”的项目的值。要在localStorage中保存某些内容，您应该使用：

localStorage.setItem('nameOfItem', itemValue);

在你的情况下，你可以获得并保存像这样的元素

var e = document.getElementById("sportList").value;
localStorage.setItem('selectedItem', e);

请记住，如果你需要保存一个对象，你可能会把它弄乱。

JSON.stringfy(yourObject)

根据Mozilla docs

“传递密钥名称时Storage接口的setItem（）方法和值，将该密钥添加到存储，或更新该密钥价值，如果它已经存在。“

存储接口的getItem（）方法，当传递一个键名时，将返回该键的值。

Answer 2

这应该可行。您的代码的第一个问题是您的函数声明实际上没有将要存储的值传递给localstorage。

function sportVal() {
  var sportVal = document.getElementById("sportList").value;
  localStorage.setItem("sportList",sportVal);
  //get value of from local storage
  var result=localStorage.getItem("sportList")
  alert(result);
}

保存用户回答提交到localstorage

2 个答案: