Javascript 通过HTML表单重新加载上的sessionStorage变量传递错误

我目前正在使用一个表单，它接收用户数据并在提交时传递给mySQL。它有一个开头段落，我想在提交失败时更改它，以显示应用的任何错误。我希望在失败时将错误传递给刷新的表单，以向用户显示出错的地方。这是我的开场白

<div id="formExplained">
     <h1>Title Here</h1>
     <p>Content Here</p>
</div>

在设置mySQL查询之前，我会检查错误，如果存在错误，就会删除代码。在这里，我还将错误传递到

会话存储

，并回显包含错误的div

if($error){
          //pass errors from php to session Storage to display on reload
          echo "<script>sessionStorage.setItem('error', '$error');</script>";
          echo "<div id='error' class='error'>$error;</div>";
          echo "<p>Here Is Proof that this is Executing</p>";
          die();
        }

if（$error）{
//将错误从php传递到会话存储以在重新加载时显示
echo“sessionStorage.setItem（'error'，'$error'）；”；
回显“$error；”；
echo“这里有证据证明这是在执行的”；
模具（）；
}

包含错误的div和段落在重新加载页面时都能完美执行。它们显示在我的地图底部

在一段单独的javascript中，我运行在所有php提交代码之上，我拉取sessionStorage变量并尝试从开始的div更改innerHTML以反映错误

<script>
  var error = sessionStorage.getItem('error');
    if(error){
        document.getElementById('formExplained').innerHTML = "<div class='error'><p>" + error + "</p></div>";
        }
</script>

var error=sessionStorage.getItem（'error'）；
如果（错误）{
document.getElementById（'formExplained'）.innerHTML=“”+错误+”
”；
}

这段代码在我第一次提交时不会正确执行，但是在第二次提交时，我的错误会按照我的要求显示在表单的顶部。无论我更改了什么，只要出现错误，都只有在延迟2次刷新后才会显示

查看我正在使用的页面（）。表格在“提供庇护”下

---

任何能帮我走出困境的指导都将不胜感激

来解决这个问题

正如Shahaf所建议的，我需要将会话存储检查移到脚本的末尾

  if($error){
      //pass errors from php to session Storage to display on reload
          echo "<script type='text/javascript'>sessionStorage.setItem('error', '$error');</script>";
        //Here is a script to pass the sessionStorage error variable to javascript variable
          echo "<script>";
          echo   "var error = sessionStorage.getItem('error');";
        //if any errors stored in sessionStorage, place them in main div
          echo  "if(error){";
        //write the error message into the main div in offerShelterForm
          echo    "document.getElementById('formExplained').innerHTML = \"<div class='error'><p>\" + error + \"</p></div>\";";
          echo  "}";
          echo "</script>";
        //kill the rest of the php code
          die();
        }

if（$error）{
//将错误从php传递到会话存储以在重新加载时显示
echo“sessionStorage.setItem（'error'，'$error'）；”；
//下面是一个将sessionStorage错误变量传递给javascript变量的脚本
回声“；
echo“var error=sessionStorage.getItem（'error'）；”；
//如果会话存储中存储了任何错误，请将它们放在main div中
回显“如果（错误）{”；
//将错误消息写入offerShelterForm中的主div
echo“document.getElementById（'formExplained'）。innerHTML=\”\“+error+\”
\“；”；
回声“}”；
回声“；
//杀死其余的php代码
模具（）；
}

您应该在文件的末尾执行会话存储检查，而不是在文件的开头执行会话存储检查

[Deprecation]主线程上的同步XMLHttpRequest已被弃用，因为它会对最终用户的体验产生不利影响。如需更多帮助，请查看https://xhr.spec.whatwg.org/. （匿名）@map.php:52

谢谢沙哈夫！事实确实如此。

  if($error){
      //pass errors from php to session Storage to display on reload
          echo "<script type='text/javascript'>sessionStorage.setItem('error', '$error');</script>";
        //Here is a script to pass the sessionStorage error variable to javascript variable
          echo "<script>";
          echo   "var error = sessionStorage.getItem('error');";
        //if any errors stored in sessionStorage, place them in main div
          echo  "if(error){";
        //write the error message into the main div in offerShelterForm
          echo    "document.getElementById('formExplained').innerHTML = \"<div class='error'><p>\" + error + \"</p></div>\";";
          echo  "}";
          echo "</script>";
        //kill the rest of the php code
          die();
        }