表单提交时重新加载页面，getElementById 返回空值，表单不起作用

Question

代码应该使用ID从表单中获取数据，并将其存储在名为studRec的数组对象中。但是，这必须在客户端完成，因此页面必须保留数据，以用于其他功能。

我试过添加返回假;它什么也没做。

<script>
var studRec = [];
            document.getElementById("save").addEventListener("click", save); 
            document.getElementById("verify").addEventListener("click", ver);
            function save(){
                var x = document.getElementsByClassName("fsubj");
                studRec[studRec.length] =  {
                    section: document.getElementbyId("section").value,
                    name: document.getElementbyId("name").value,
                    gender: document.getElementbyId("gender").value,
                    age: document.getElementbyId("Age").value,
                    subjects: x 
                }
                console.log(studRec);
            }
</script>

它应该登录到控制台，将信息放入表单中。

Answer 1

将 save 方法更改为接受单个输入参数，即事件实例传递的单击事件，然后使用 preventDefault ：

function save(e) {
  e.preventDefault();
  ...
}

更多信息请看这里

完整答案：

var studRec = [];
document.getElementById("save").addEventListener("click", save); 
document.getElementById("verify").addEventListener("click", ver);
function save(e){
  e.preventDefault();
  var x = document.getElementsByClassName("fsubj");
  studRec[studRec.length] =  {
      section: document.getElementbyId("section").value,
      name: document.getElementbyId("name").value,
      gender: document.getElementbyId("gender").value,
      age: document.getElementbyId("Age").value,
      subjects: x 
  }
  console.log(studRec);
}