การห้ามการส่งแบบฟอร์มใน JavaScript

หากจำเป็น คุณสามารถห้ามการส่งแบบฟอร์มได้ ทำได้ผ่านทาง preventDefault ที่คุณรู้จักอยู่แล้ว มาดูตัวอย่างกัน

สมมติว่าเรามีแบบฟอร์มต่อไปนี้:

public/form.html<form action="/handler/" method="POST">
  <input name="test1">
  <input name="test2">
  <input type="submit">
</form>

รับลิงก์ไปยังแบบฟอร์มในตัวแปร:

public/script.jslet form = document.querySelector('form');

สามารถตรวจจับการส่งแบบฟอร์มได้ผ่านเหตุการณ์ submit:

public/script.jsform.addEventListener('submit', function() {
  
});

ตอนนี้เรามาห้ามการส่งแบบฟอร์มกัน:

public/script.jsform.addEventListener('submit', function(event) {
  event.preventDefault();
});