如何先阻止a标签默认行为，再执行其原有默认行为？

嘿，这个需求我之前也碰到过！首先得明确一点：一旦你调用了e.preventDefault()阻止了a标签的默认行为，是没有原生API能直接"恢复"这个默认动作的——因为事件的默认行为在被阻止后就彻底取消了，没法逆向触发。不过别担心，我们可以用一个巧妙的办法模拟原生行为，还不会被浏览器当成弹窗。

可行方案：移除监听器后手动触发点击 #

核心思路是：先把阻止默认行为的事件监听器去掉，再手动触发a标签的点击事件，这样浏览器就会执行它原本的默认行为（包括target="_blank"在新窗口打开），而且因为整个流程是在用户的原始点击上下文里触发的，不会被判定为恶意弹窗。

修改后的代码如下：

// 给事件处理函数命名，方便后续移除
function handleLinkClick(e) {
  e.preventDefault();
  const linkElement = this;
  
  axios.post('options', new FormData(document.querySelector('#myform')))
    .then(() => {
      // 移除当前的点击监听器，避免循环触发
      linkElement.removeEventListener('click', handleLinkClick);
      // 手动触发点击，此时会执行原生默认行为
      linkElement.click();
    });
}

// 绑定监听器
document.getElementById('mylink').addEventListener('click', handleLinkClick);

为什么这个方案有效？ #

• 手动调用linkElement.click()是在用户的原始交互流程中触发的（从用户点击开始，到异步请求完成，整个过程都在浏览器的"用户交互上下文"内），所以浏览器会把它当成正常的用户操作，不会拦截新窗口。
• 移除监听器是为了防止手动触发点击时再次进入我们的自定义逻辑，造成循环调用。

注意事项 #

• 必须给事件处理函数起名字，匿名函数无法被removeEventListener移除，这是关键！
• 如果你的异步请求耗时过长（比如超过几秒钟），浏览器可能会脱离用户交互上下文，此时手动触发点击还是可能被拦截，所以尽量保证异步操作的响应速度。

内容的提问来源于stack exchange，提问作者rap-2-h