HTML会话数据不会保存并且不会清除页面

时间:2018-03-08 19:56:37

标签: javascript html session-storage

所以我可以保存一个问题但是当我添加更多时它不起作用。我虽然我可以添加到postquestion功能复制和粘贴,只需更改16到15但我想这很容易 我需要保存大约16个问题,每个问题有4个选项,所选的收音机是正确答案。 还有办法将选定的单选按钮保存到会话和本地存储中吗?

function postQuestion() {
    var obj = {
      question: document.getElementById("question16").value,
      choice62: document.getElementById("choice62").value,
      choice63: document.getElementById("choice63").value,
      choice64: document.getElementById("choice64").value,
      choice65: document.getElementById("choice65").value
    }

    try {
      sessionStorage.setItem("data", JSON.stringify(obj));
    } catch (error) {
      alert("Enable Session storage");
    }
    
    return false;
}

function PreviewImage16() {

   var oFReader = new FileReader();
   oFReader.readAsDataURL(document.getElementById("uploadImage16").files[0]);
   
    oFReader.onload = function (oFREvent) {
      document.getElementById("uploadPreview16").src = oFREvent.target.result;
      sessionStorage.setItem("image", oFREvent.target.result);
    };
};
<div>
    Enter Question 16:
    <input type="text" id="question16" name="question16">
    <br>
    <br> Next, add a correct answer and several incorrect answers for your question.
    <br>
    <form onsubmit="return postQuestion()">
      <p>
        <input type="radio" name="choice62" value="62">
        <label>
          <input id="choice62" size="50">
        </label>
      </p>
    <p>
      <input type="radio" name="choice63" value="63">
      <label>
        <input id="choice63" size="50">
      </label>
    </p>
    <p>
      <input type="radio" name="choice64" value="64">
      <label>
        <input id="choice64" size="50">
      </label>
    </p>
    <p>
      <input type="radio" name="choice65" value="65">
      <label>
        <input id="choice65" size="50">
      </label>
    </p>
    <p>
      <button type="submit"> Submit</button>
    </p>
    <br>
    <img id="uploadPreview16" style="width: 100px; height: 100px;" />
    <input id="uploadImage16" type="file" name="myPhoto16" onchange="PreviewImage16();" />
</div>

0 个答案:

没有答案