Question

在Javascript中，如何附加事件处理程序以使其在默认操作后运行？

<form target="_blank" action="submit.php" onsubmit="doThisAfterSubmit()">
    <input type="submit" onclick="doThisAfterSubmit()" />
</form>

类似但不充分的SO问题：

javascript: Possible to add event handler that runs after the default behavior?

How to catch event after default action was performed in JavaScript

我已阅读过这些内容，但他们正在处理使用keyup等keypress之类的变体解决的击键事件。我见过的唯一其他解决方案是setTimeout()方法。我想避免使用setTimeout()支持更优雅的解决方案（如果存在）。

我的用例是我想在提交后从DOM中删除表单。

Answer 1

您可以自己执行默认操作，然后执行所需操作，然后阻止默认操作运行。

<form target="_blank" action="submit.php"
        onsubmit="this.submit(); doThisAfterSubmit(this); return false;">
    <input type="submit" />
</form>

注意：在“onsubmit”中调用this.submit()不会像您想象的那样导致无限循环。

jsfiddle demo

编辑：我的原始jsfiddle仅在表单提交后显示文本。我再次尝试了，但更改了它以删除您想要的表单。这导致表单不再提交，即使先调用this.submit()。在这种情况下，您可以使用setTimeout()来延迟删除表单，直到原始线程执行完毕，如下所示：

function doThisAfterSubmit(form) {
    setTimeout(function() {
        $(form).remove();
    }, 0);
};

现在表单在删除之前已提交。

jsfiddle demo

Answer 2

您可以改为使用事件冒泡：

<div onclick="this.remove();">
  <form target="_blank" action="submit.php" onsubmit="alert('submitted);">
    <input type="submit" />
  </form>
</div>

Javascript事件处理程序在默认行为后执行

2 个答案: