Javascript Jquery：如何处理；停止/取消“；用户停止表单提交时发生的事件？

我发现了这个问题，但没有得到回答：

因此，如果用户提交表单，在加载表单时，用户按下“esc”，或单击浏览器的“停止”按钮，我想调用一个函数，是否可能

注意：我知道我们可以绑定“esc”按钮，但是如果用户通过浏览器的“停止/取消”按钮停止提交，该怎么办

是否有JavaScript或jquery可能的解决方案

编辑：

我知道我们可以用XHR（json/ajax）post处理这个问题，但我正在寻找一个正常的表单提交

简单地说，我试图实现的是：当用户按下“提交”按钮时，我想禁用“提交”按钮。如果用户在加载时取消/停止提交，则提交按钮仍将被禁用（如果提交被取消/停止，则应重新启用）

---

编辑/改写-2013年12月16日：

我的问题与此类似：

例如，我有以下表格：

<form method="post" enctype="multipart/form-data">
    <input type="file" name="imginput" value=""/>
    <input type="text" name="textinput" value=""/>
    <input type="button" id="submitbtn" value="Submit"/>
</form>

以下是问题场景：

新手用户填写表单，然后双击提交按钮。将相同的表单值插入服务器两次

努力实现：

我想用

$（'#submitbtn'）.bind（'click'，function（）{$（this）.attr（'disabled'，'disabled'）；$（this.prop（'disabled'，true）；}）禁用单击时的提交按钮，这解决了问题，但产生了另一个问题：如果用户单击“esc”或在表单仍在提交时停止浏览器，则提交按钮仍将被禁用，并且用户无法再重新提交表单，我希望在取消“提交过程”后立即重新启用提交按钮。有没有办法做到这一点？类似于：
$（window）.onStop（function（）{…}）？或者一种表示提交过程已中断（或仍在运行）的方式

注:


正在寻找客户端（javascript或jquery）解决方案。我知道通过服务器端检查相同的条目可以很容易地解决这个问题，但我对服务器端解决方案不感兴趣
这个问题可以通过XHR（ajax/json）绑定（比如onSuccess、onFailure等）来解决。。但在这种情况下，我使用的是普通帖子，而不是XHR，所以请从您的答案中排除XHR
解决方案必须至少解决5种主要浏览器（IE、FF、Chrome、Safari、Opera）的问题
有人可能建议我们为“esc”按钮绑定“keypress”，因此当用户按下“esc”时，我们重新启用提交按钮。这很好，但这是解决问题的一半。如果用户通过浏览器的“停止”按钮停止了“提交过程”，有没有方法表明此停止按钮已被单击

Internet Explorer触发了document.onstop事件，但其他浏览器似乎不支持该事件。请注意，当用户单击“停止”或按Esc键时，或者当用户在页面加载过程中导航到另一个页面时，会触发该命令，这具有相同的效果

我不相信有可靠的方法可以在其他浏览器中单击“停止”触发事件。也许可以这样做：保持与服务器的连接处于打开状态（如Comet方法），在连接中流式传输某种形式的keep alive，并检测流是否结束（如我假设单击Stop按钮时会发生的情况）

From:
最后，这个问题实际上分解了这个复杂的问题，因此可以按其应该的方式分部分解决。首先，让我们把大象带出房间：


没有跨浏览器解决方案可以检测用户何时点击停止/（ref）按钮

事实上，我查了一会儿，找不到怎么做，但也许有人可以提供答案，并启发我们两个。现在，让我们把第二只大象带出房间


不允许Ajax请求（出于某种原因）。一旦用户点击提交按钮，实际的提交事件就会触发，我们就陷入了困境

事实上，我们能够在处理某些请求时做一些事情，这就是所谓的异步（就像“Ajax”中的第一个“a”）。让我们看看第三只大象


我有一些愚蠢的/没有经验的/clickety clackety/滥用者，他们可能会意外地在服务器上造成不一致（即：不需要的副本）。我们应该提供一种机制来阻止这种事件

当然，禁用按钮是解决这一难题的最简单方法。我们捕获提交，放入一行以禁用该表单中的任何进一步提交事件。完成。下一头大象能进来吗


这个过程已经开始，用户看到进度指示器旋转，意识到他只是搞砸了。他想阻止它，见鬼！他需要阻止它

问题，用户不知道（他当然不需要知道）服务器是否已经有完整的头并且正在处理请求。服务器可以侦听以查看客户端是否已中止，但


用户点击停止按钮！服务器是否处理了请求？服务器转储了吗？我的数据进入数据库了吗？哦，现在我有一个残疾表格，我不能再使用了，我不知道我所做的是否有后果。刷新一下怎么样

现在，您的问题中有一大堆大漏洞，并且由于您不希望您的请求是异步的，并且无法可靠地侦听
browser.onStop
，这使得问题更加严重

我的回答
换个角度思考问题


你害怕前后矛盾。解决方案：在第一次提交后禁用提交事件

你的用户很笨/没有经验。解决方案：红色大标签
警告：在处理过程中不要按下停止按钮，或在请求完成之前离开页面

<form class="js-form-submit-once">

  /* .. form elements here*/

</form>

var wasNeverSubmitted = true; 

$('js-form-submit-once').on('click', function(){

  if( wasNeverSubmitted ){
    wasNeverSubmitted = false;
    /* ... do nothing, let it submit */
  }
  else {
    return false;  /* cancels form submission */
  }

});