Javascript “如何修复”；undefined不是对象（评估'；form.submit.addEventListener'；）”；

我在尝试使用基本的AJAX表单时遇到了很多麻烦，尤其是当前的问题。 我有一些代码总是出错。以下是错误消息：

undefined不是对象（评估'form.submit.addEventListener'）

。。。下面是导致错误的代码位：

form.submit.addEventListener('click', () => {

  console.log('button pressed!');

});

我真的不知道为什么，因为我正在使用箭头函数，所以它不应该是未定义的，是吗？我对javascript非常陌生，所以我可能错过了一些我现在非常困惑的事情。

如果你想调整你的表单，请听表单

提交

事件，不要点击按钮

const form = document.querySelector("#formidable");

form.addEventListener("submit", async (ev) => {

  ev.preventDefault(); // prevent browser triggering action
  console.log('Someone tried to submit my formidable form!');

  // Than do your Ajax Magic!
  const response = await fetch(form.action, {
    method: form.method || "post",
    body: new FormData(form)
  });

  const result = await response.json();
  console.log(result.message); // log the response JSON from server!

});

---

如果没有延迟，请确保将您的

标记放置在关闭

标记之前，以确保DOM已被解析并准备就绪。

什么是

表单

？如果已定义，它是否具有

submit

属性？如果有，此

submit

属性是否有

addEventListener

方法？非常感谢您的回复！我刚刚尝试了所有这一切，但我似乎得到了本质上相同的错误（

null不是一个对象（评估'form.submit.addEventListener'）

），与以前一样，它是相同的，但未定义，而不是null。。。不知道该怎么办，有什么想法吗？@jec1918不客气。您能告诉我您在我的答案中看到

form.submit.addEventListener

的确切位置吗？“提交”事件侦听器应该附加到表单本身。看到querySelector了吗？对不起，那只是我的错别字！实际上，它只是一个

表单。addEventListener

，我仍然得到相同的错误。此外，我无法将

标记放在

标记之前，因为我使用的php包含在一些

标记中（用于一致的页面布局）。因此，

标记在页面上仍然有footer.php和它下面的bootstrap CDN

链接-这会影响DOM吗？@jec1918如果

console.log（form）

（添加到第二行）在console

中给出未定义的
，这显然意味着JS当时没有在DOM中找到任何表单。一种方法是推迟脚本加载；或使用准备好的文件；或者干脆把脚本放在最好的地方。这就在关闭
标记之前，而不是由于加载JavaSript解释器而中断（暂停）HTML解析。