为什么不是'；我的javascript表单验证不起作用吗？

My JS form validation没有打印出错误消息，它似乎忽略了prevent默认值

我已经检查了代码多次，似乎找不到错误

HTML:

---

没有错误消息，但我希望它显示我在表单上方设置的js错误消息。

这是一个打字错误。设置

e.preventDefault（）

而不是

e.preventDef**ual**t（）

。您还错过了显示错误的error div

const firstname=document.getElementById（“firstname”）
const lastname=document.getElementById（“lastname”）
const email=document.getElementById（“电子邮件”）
const comment=document.getElementById（“comment”）
const form=document.getElementById（'form'）
const errorElement=document.getElementById（'error'））
表格.addEventListener（'submit'，（e）=>{
让消息=[]
if（firstname.value==''| | firstname.value==null）{
messages.push（'需要名称'）
}
如果（messages.length>0）{
e、 预防默认值（）
errorElement.innerText=消息.join（'，'））
}
})

名字
姓
电子邮件
评论：
提交

<form id="form">
  <div>
    <label for="firstname">First Name</label>
    <input id="firstname" name="firstname" type="text" />

    <label for="lastname">Last Name</label>
    <input type="text" name="lastname" id="lastname" placeholder="Doe" />

    <label for="email">Email</label>
    <input type="email" name="email" id="email" placeholder="john@doe.com" />

    <label for="comment">Comment:</label>
    <textarea id="comment" name="comment" placeholder="Write something.." style="height:200px;  width: 100%"></textarea>

    <button type="submit">Submit</button>
  </div>
</form>

const firstname = document.getElementById("firstname")
const lastname = document.getElementById("lastname")
const email = document.getElementById("email")
const comment = document.getElementById("comment")
const form = document.getElementById('form')
const errorElement = document.getElementById('error')
form.addEventListener('submit', (e) => {
  let messages = []
  if (firstname.value === '' || firstname.value == null) {
    messages.push('Name is required')
  }
  if (messages.length > 0) {
    e.preventDefualt()
    errorElement.innerText = messages.join(', ')
  }
})