javascript - 如何在表单提交事件之后运行一些 JavaScript？

Question

我正在处理一个可能需要几秒钟才能提交的 HTML 表单。我想在提交后禁用表单中的某些字段。

我可以在表单submit事件的处理程序中执行此操作，但这会在表单提交之前触发。如果我禁用这些控件，它们的值不会包含在发送到服务器的发布数据中。

我尝试在我的处理程序中取消提交事件，submit从表单中删除我的事件处理程序，通过 JavaScript 自己提交表单，然后禁用控件，但问题是我需要知道用户点击了哪个按钮提交表格。此信息在原始表单提交中，但显然不在我手动触发的那个中（因为没有单击任何按钮）。

我可以尝试将此信息复制到我的手动表单提交中，但是有没有办法在表单提交后运行我的禁用代码？

score 18 · Accepted Answer

不要通过禁用提交按钮来允许进一步提交，您无需执行任何其他操作。或者，隐藏表单并用旋转的东西替换它，这样用户就会被迷住，以为正在发生重要的事情。

score 1 · Accepted Answer

提交表单后，您可以触发此功能：

function name() {
    $("#target :input").attr("disabled", true);
    return true;
}

此代码将禁用从以“target”为 id 的元素继承的所有 from 字段。

此版本仅匹配所有输入元素：

function name() {
    $("#target input").attr("disabled", true);
    return true;
}

您必须包含 jQuery 库才能使此代码正常工作。

score 1 · Accepted Answer

这与 sp00m 的答案几乎相同，只是它使用 Javascripts 本机提交来防止递归调用。

$('#myForm').submit(function() {
    this.submit();
    disableFields(); // your own function
    return false;
});

score -1 · Accepted Answer

您可以使用 jQuery.post()提交，并.button().click()检测点击了哪个按钮

.post()提交完成后执行一个函数

score -2 · Accepted Answer

您可以延迟操作的执行，以便仅在提交完成后调用它们：

$('#myForm').submit(function() {
    setTimeout(function() {
        // Run disabling code here
    }, 1);
    return true;
}

setTimeout(fn, 1)将函数放在执行队列的末尾，以便在函数运行之前开始提交表单。

setTimeout可用于队列操作，有点像线程索引或 z-index：

5 回答 5