在 Web 开发中，事件处理程序是常见的技术，可以使用它来响应用户的交互。当事件被触发时，浏览器会默认执行相应的动作。有时，我们需要阻止浏览器默认的行为。这时，我们可以使用 event.preventDefault() 方法。
但是，在某些情况下，我们可能希望在调用 event.preventDefault() 之后再次执行默认行为。那么，是否存在一种通用的方法来实现这一点呢？本文将探讨这个问题，并提供示例代码和指导意义。
什么是 event.preventDefault()？
在了解如何调用默认行为之前，先来了解一下 event.preventDefault() 方法是什么。
preventDefault() 是一个用于取消事件的默认动作的方法。当事件被触发时，浏览器会执行相应的默认行为，例如，当用户单击链接时，浏览器会打开链接对应的页面。如果我们不想执行该默认行为，就可以使用 preventDefault() 来取消它。
下面是一个例子，演示了如何使用 preventDefault() 方法来阻止用户单击链接时打开链接：
const link = document.querySelector('a');
link.addEventListener('click', (event) => {
event.preventDefault();
});如何调用默认行为？
当我们使用 preventDefault() 方法来取消事件的默认行为时，就需要考虑如何再次执行该默认行为了。在某些情况下，可能会有一种通用的方法来实现这一点，但是在大多数情况下，我们需要根据具体的场景来进行处理。
以下是几种常见的场景和解决方案：
1. 单击链接打开新窗口
在单击链接时打开新窗口是一个常见的需求。如果在链接上使用 preventDefault() 方法取消了默认行为，那么我们可以使用以下代码来打开新窗口：
const link = document.querySelector('a');
link.addEventListener('click', (event) => {
event.preventDefault();
window.open(link.href, '_blank');
});这里使用了 window.open() 方法来打开链接对应的页面。其中，'_blank' 参数表示在新窗口中打开页面，而不是在当前窗口中打开。
2. 禁止表单提交后再次提交
在表单提交后禁止再次提交是一个常见的需求。如果在表单提交时使用 preventDefault() 方法取消了默认行为，那么我们可以使用以下代码来禁用提交按钮：
<form id="my-form"> <input type="text" name="name" /> <button type="submit">提交</button> </form>
const form = document.querySelector('#my-form');
const submitButton = form.querySelector('button[type="submit"]');
form.addEventListener('submit', (event) => {
event.preventDefault();
submitButton.disabled = true;
});这里，我们使用了 disabled 属性来禁用提交按钮。这将防止用户在表单提交后再次提交。
3. 阻止滚动事件后再次滚动
在某些情况下，可能需要阻止页面滚动事件，例如，在菜单打开时。如果我们在滚动事件处理程序中使用了 preventDefault() 方法来取消默认行为，那么我们可以使用以下代码来再次允许滚动：
const menu = document.querySelector('#my-menu');
menu.addEventListener('scroll', (event) => {
event.preventDefault();
menu.scrollTop += event.deltaY; // deltaY 表示上下滚动的距离
});在这个例子中，我们使用了 deltaY 属性来获取用户滚动的距离，并将其添加到菜单的 `
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27503