JS addEventListener不起作用

Question

對於這個簡單的問題，我事先表示歉意，但已經晚了，在我開始工作之前，我不想睡覺……而且我知道我對過去幾個小時的其他工作一直感到麻木。

基本上，我只是想通過使用addEventListener分配提交按鈕來調用add()函數。 當我單擊按鈕時，它清除了表單，但沒有執行其他任何操作。 如果我填寫這些字段，然后在Chrome的JS控制台中調用add() ，則它可以完美運行...很明顯，事件監聽器未添加到按鈕中，並且我不想直接調用該函數。 提前致謝。

HTML：

  <ul> <li> <label for="firstname">First Name:</label> <input type="text" id="firstname"/> </li> <li> <label for="lastname">Last Name:</label> <input type="text" id="lastname"/> </li> <li> <label for="email">Email:</label> <input type="text" id="email"/> </li> <li> <label for="subject">Subject:</label> <input type="text" id="subject"/> </li> <li> <input type="submit" value="Save" id="btnSave"/> </li> </ul> 

JS：

var rolodex = localStorage.getItem('rolodex'); //load stored data if there is any

window.onload = function() {
    rolodex = JSON.parse(rolodex);
    if(rolodex === null) { //if no data, initialize an empty array
        rolodex = [];
    } else {
    console.log(rolodex);
    }
};

var add = function(){
    var SME = JSON.stringify({
        firstname:document.getElementById('firstname').value,
        lastname:document.getElementById('lastname').value,
        email:document.getElementById('email').value,
        subject:document.getElementById('subject').value
    });

    rolodex.push(SME);
    localStorage.setItem('rolodex', JSON.stringify(rolodex));
    alert("Saved");
};

var submit = function(){
    var btnSave = document.getElementById('btnSave');
    btnSave.addEventListener('click', add(), false);
};

Answer 1

有人發布了部分答案，然后將其刪除，所以我會把我的所作所為。

1. 修復了add()被調用而不是被分配為僅在addEventListener add的問題

2. 刪除了Submit函數並將其內容放在window.onLoad函數中，以便將其自動分配。