将多个对象推入 JavaScript 数组,但导致对象覆盖

Push multiple object into JavaScript array, but causes object overwrite

我想将多个对象压入一个数组,但实际上导致覆盖,数组中始终有1个对象,也就是最后压入的对象。

<!DOCTYPE html>
<html>
<head>
<!--import the external class file-->
<script src="Student.js"></script>

<script>

var studentArray = [];

var professorArray = new Array();

//when register button is clicked, add a user to array
function addUser(email, date, content){
    var email = document.getElementById("email").value;
    var extension = getExtension(email);
    
    if(extension == "mylaurier.ca"){
        //identified as a student, create and push the student into the array
        var student = new Student(email, 0, "");
        studentArray.push(student);
    }
}

//get the extension of the user email
function getExtension(email){
    var elements = email.split("@");
    return elements[1];
}
</script>
</head>

<body>
    <form> 
        <label for="email">Email:</label>
            <input type="text" name="email" id="email" placeholder="Enter Email" value="" data-clear-btn="true">
                <button onclick="addUser()">Register</button>
    </form>
</body>
</html>

点击注册按钮表单提交被触发,它再次重新加载页面。于是studentArray再次初始化。

为表单设置 onsubmit="return false"

试试这个代码。

<form onsubmit="return false">
   <label for="email">Email:</label>
   <input type="text" name="email" id="email" placeholder="Enter Email" value="" data-clear-btn="true">
   <button onclick="addUser()">Register</button>
</form>

希望对您有所帮助。