用Javascript检测取消的表单发布

Detect cancelled form post with Javascript

本文关键字：表单 取消 Javascript 检测      更新时间：2023-09-26

我正在做一个有很多抽象的web项目——很多代码都藏在视图模板、公司内部javascript库等中。

有人要求我"劫持"表单提交按钮，在提交表单时禁用它们，以禁止额外的点击。问题是，我仍然需要提交按钮，因为它在99%的系统中用作表单输入(不是最佳实践，但我没有写那个代码!)

我所做的是，当用户点击"保存"，该按钮被隐藏使用jQuery和一个完全重复的是禁用旋转图标放在它的位置:

function showSpinningButton(button){
    $(button).hide();
    clone = $(button).clone();
    clone.prop('disabled', true);
    $(button).parent().append(clone);
    clone.show();
}

这在标准用例中有效，但利基用例是验证——我没有办法检测表单何时无效，按钮何时需要重置为标准。这尤其麻烦，因为所有的验证都是在面向外部的Javascript库中完成的，我不允许修改这些库。

要点是:是否有一个DOM事件被触发时，已提交的表单被取消(即onclick="返回false;")，我可以附加一个处理程序来重置按钮?

您可以在验证函数上使用包装器:

var oldHandler = form.prop("onsubmit");
form.removeProp("onsubmit").submit(function(e) {
  var result = oldHandler.call(this, e);
  if (result == false) {
    // reset your button
  }
  return result;
});
相关文章：