如何阻止事件的默认行为？

TL;DR

要在 JavaScript 中阻止事件的默认行为，您可以在事件对象上使用 preventDefault 方法。例如，如果您想阻止表单提交，您可以执行以下操作：

document.querySelector('form').addEventListener('submit', function (event) {
  event.preventDefault();
});

此方法会阻止与事件关联的默认操作发生。

preventDefault 方法用于阻止事件的默认操作发生。这在您想要覆盖元素的默认行为（例如，阻止链接导航到新页面或阻止表单提交）的情况下非常有用。

要阻止表单提交，您可以将事件监听器附加到表单的 submit 事件，并在事件处理程序中调用 preventDefault：

document.querySelector('form').addEventListener('submit', function (event) {
  event.preventDefault();
  // 额外的代码来处理表单提交
});

要阻止链接导航到新页面，您可以将事件监听器附加到链接的 click 事件并调用 preventDefault：

document.querySelector('a').addEventListener('click', function (event) {
  event.preventDefault();
  // 额外的代码来处理点击事件
});

preventDefault 方法可以与各种其他事件一起使用，例如 keydown、contextmenu 等。这是一个阻止右键单击时出现默认上下文菜单的示例：

document.addEventListener('contextmenu', function (event) {
  event.preventDefault();
  // 额外的代码来处理右键单击事件
});