防止重复提交表单，同时在点击“返回”按钮时不破坏页面。

Question

我有一个带有表单的页面，我正在尝试防止重复提交，这是相当简单的（如果有人感兴趣，我使用了这个方法）。

$("form").submit(function()
{
    setTimeout(function()
    {
        $("input").attr("disabled", "disabled");
    }, 50);
});

我从这个页面中偷了一个方法，它可以很好地工作。正如预期的那样，输入框很快就被禁用，表单按预期提交，用户被重定向。

我的问题在于：我预计用户有时会使用返回按钮而不是页面内导航，因此如果他们点击返回按钮，我希望页面仍然可以正常使用。但是，当我在成功提交后点击返回按钮时，我被返回到前一页，所有输入框都被禁用（你可能已经知道会发生这种情况）。我希望他们在点击返回按钮后仍然能够使用该页面，如果他们想要的话。

我首先尝试使用头部/元标签告诉浏览器不要缓存页面，但这并没有起作用（在Firefox 3.6.8中）-然后我决定我也不想这样做，因为它可能不兼容跨浏览器，并且可能不是最佳实践（这里是其中之一）。我不想使用任何“打破”返回按钮的东西，就像我见过的一些应用程序那样（例如，当用户单击它时，它不会将其返回到上一页，而是强制他们停留在该页面），这对我来说似乎是一个坏主意。有人知道如何在客户端防止重复提交表单，而不使用户单击返回按钮时渲染页面无用吗？（如果有任何影响的话，我正在使用ASP.NET MVC 1）。

- Andy

Answer 1

为什么不为每个表单创建一个唯一的随机密钥，然后在提交后将该密钥插入数据库中，如果该密钥已经存在于数据库中，则表单已经被提交过了，因此不需要再次处理数据... 这样你就不会修改DOM并且可以确保数据完整性。

- Joshua Smickus

---

这是一个很好的想法，可以防止在服务器上重复处理表单。虽然我的问题背后的思路是要尽可能地阻止客户端的操作。显然我们也必须在后端进行处理，但我希望尝试避免任何客户端动作。 - Andy

Answer 2

嗯，似乎没有其他人想到更好的主意并发布了它。我注意到我们自己的Stack Overflow也有相同的行为（至少在“提问”页面上），禁用提交按钮，当我点击“返回”时，按钮仍然被禁用。也许我能做的最好的就是让按钮保持禁用状态，从而强制他们手动刷新页面，或者（希望）鼓励他们尽可能使用站点导航而不是后退按钮。

如果还有其他人有更好的想法，我仍然愿意听取。

- Andy