如何使用javascript和ajax确定学生的字母等级？

Question

所以我制作了一个关于考试的程序，我需要确定学生的字母成绩，但首先他们必须回答一些问题，然后根据学生得到的分数，学生将获得字母成绩，有人推荐我使用 AJAX 因为我需要在表单中完成该过程而不刷新，所以我尝试制作它，但我最终感到困惑，有人可以帮助我吗？问题是结果总是“没有给出分数”，但我在控制台中尝试过，没有错误，结果是正确的结果。这是代码：<div class = "form"><button id = "submit" name = "submit"  value = "submit" > SUBMIT </button><div id="myModal" class="modal">  <div class="modal-content">    <h3> Are you sure you want to submit? </h3>    <button id = "yes" name = "yes" class = "yes" value = "submit"> YES </button>    <button id = "no" name = "no" class = "no"> NO </button>  </div></div><div id="myModalLast" class="modalLast">  <div class="modal-contentLast">   <a href = "personal.php"> <span class="close">&times;</span> </a><div class = "pic"></div>      <h3> Full name: Cathleen Joyce Imperial Almeda </h3>      <h3> Total items:20 <p id = "scoress" name = "scorename"></p> </h3>     <h1> <br><p id = "scores" name = "realscores"></p>   Rank:<p id = "rank"></p></h1>   </div></div></div>这是针对 ajax 部分的：  <script>function loadDoc(scoress) {  var xhttp = new XMLHttpRequest();  xhttp.open("POST", "examExtension.php", true); xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");  xhttp.onreadystatechange = function() {    if (this.readyState == 4 && this.status == 200) {      scoreElement.innerHTML = "Your Score: " + this.responseText;      console.log('Grade calculation complete');    }  }xhttp.send(scoress);}</script>这是 examExtension.php    <?php// Check if the score is given. If it is, continue. Otherwise stop the script.if (!isset($_POST['scoress'])) {  echo 'No score has been given';  exit;}// Convert score value to a number.$score = intval($_POST['scoress']);if ($score > 19 and $score < 21) {  echo "A+";} if ($score > 18 and $score < 20) {  echo "A";} if($score > 17 and $score < 19) {  echo "A-";}if ($score > 16 and $score < 18) {  echo "B+";} if ($score > 15 and $score < 17) {  echo "B";} if ($score > 14 and $score < 16) {  echo "B-";} if ($score > 13 and $score < 15) {  echo "C+";} 

Answer 1

在xhttp.send()您忘记设置参数的变量。根据w3schools Ajax post 请求，您必须像这样发布数据：

function loadDoc(scoress) {

    var xhttp = new XMLHttpRequest();

    xhttp.onreadystatechange = function() {

        if (this.readyState == 4 && this.status == 200) {

            scoreElement.innerHTML = "Your Score: " + this.responseText;

            console.log('Grade calculation complete');

        }

    }

    let data = "scoress=" + scoress;

    xhttp.open("POST", "examExtension.php", true);

    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

    xhttp.send(data);

}

那应该对你有用！