javascript - IE、Edge 将存储文本替换为 'null'

Question

所以我的网站上有这个小联系表单，它应该在一个空的 p 标签中输入一些文本，告诉客户它已经提交了。它工作正常，它做了它应该做的事情，但在 IE/Edge 中它会忽略所有内容并将单词 null 输入到 p 标签中。

请原谅我，我对 javascript 还很陌生，但我找不到任何地方可以解决这个错误。任何帮助将不胜感激。

<form id="contact-form" method="post" action="#" onsubmit="return setReturn()">
  <input type="hidden" value="someone@email.com" name="emailTo">
  <fieldset>
  <p id="thanks"></p>
  <legend>Send me a message</legend>
  <div class="contact-info">
   <input placeholder="Name*" type="text" name="name" required>
   <input placeholder="Email*" type="Email" name="email" required>
  </div>
   <textarea placeholder="Message*" name="message" required></textarea>
   <input type="submit" value="Submit" name="submitContact" class="button">
  </fieldset>
</form>
<script>
  function setReturn(){
   localStorage.setItem("thanks", "Your request was sent successfully!");
  }

  document.getElementById("thanks").innerHTML =    localStorage.getItem("thanks");
  localStorage.clear();
</script>

Answer 1

您的问题是，当设置“thanks”元素的innerHTML时，localStorage中的字符串未设置。

然后，当提交表单时，localStorage 项已设置，但“thanks”元素的innerHTML 未设置(之前已设置为未定义)。

为了确保提交表单时更新“thanks”元素，您需要将设置它的行包含在提交表单时触发的函数中。

function setReturn(){
  localStorage.setItem("thanks", "Your request was sent successfully!");
  document.getElementById("thanks").innerHTML =    localStorage.getItem("thanks");
  localStorage.clear();
}