14

我只是想知道是否有人对我所处的情况有一些信息或反馈。目前我面临一个“双重提交”问题，我点击一次“提交”按钮，然后提交了两次表格。这仅在 IE9 中发生，但我仅针对 Safari、Chrome（最新）、FF（版本 5/6）、IE8 和 IE9 进行了测试。

这是代码：

<!DOCTYPE html>
<html lang="en-us" dir="ltr">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
<title>IE9 test</title>
</head>
<body>
<h1>Testing</h1>
<form method="POST" id="submit_form">
<input type="text" name="x" value="xxxx" />
<input type="text" name="y" value="yyyy" />
<button type="submit" class="btn_sign_in" id="btn_logon" onclick="this.disabled=true;document.forms[0].submit();">Submit</button>
</form>
</body>
</html>

有问题的部分是：

onclick="this.disabled=true;document.forms[0].submit();"

代码已经在我的网站上很久了，这是我今年IE9才发布以来第一次遇到双重提交问题，可能这几天使用IE9的人越来越多，因此我收到了用户关于这个问题的投诉.

最困难的部分是双重提交问题并不总是可重现的。有时会重复提交，有时会提交一次。

我目前的工作是改变：

<meta http-equiv="X-UA-Compatible" content="IE=edge" >

并更改为：

<meta http-equiv="X-UA-Compatible" content="IE=8" >

这会强制 IE9 使用 IE8 兼容性，并且它将正确执行 Javascript 以进行提交。

我打电话给微软支持，他们声称这是一个“Javascript 兼容性问题”，所以我们需要微调我们的 Javascript 以使我们的网站在 IE9 下正常工作..（呃！）

无论如何，是我的代码：

onclick="this.disabled=true;document.forms[0].submit();"

一开始就错了吗？因为即使其他浏览器没有抱怨，但这可能是不正确的开始？

我希望如果有人也面临类似的问题有更多的信息或反馈。目前，如果我不将 X-UA-Compatible 更改为 IE=8，我可以将我的代码更改为：

onclick="this.disabled=true;"

这也将解决双重提交问题，但是否还有我们应该注意的 IE9 兼容性问题列表？

谢谢！

4

7 回答 7

21

这段代码是错误的：

onclick="this.disabled=true;document.forms[0].submit();"

onclick Javascript 不保证正常提交也不会执行。为此，它需要返回 false，如下所示：

onclick="this.disabled=true;document.forms[0].submit(); return false;"

这种行为变化是 IE9 错误吗？这取决于，这可能取决于时间问题导致的法律行为。如果 DOM/Javacript 标准保证 document.submit() 是文档中所有执行的结束，这只是一个错误。我怀疑情况是否如此。

于 2011-12-08T20:36:31.580 回答
5

抽象出复杂性，问题似乎是当在 javascript 中触发提交事件时， IE9 只需单击一次按钮即可提交表单两次。

一般来说，我发现这样做可以解决 IE9 双表单提交问题：

（IE9 双重提交 HTML 失败）：

<input type="submit" />

（IE9 html 双重提交修复）：

<input type="submit" onclick="return false; " />

所以基本上，我正在使用事件侦听器（ click ）处理 javascript 中的表单提交（未显示），但在老式事件处理程序（ onclick ）上返回 false ，即使您已经通过事件监听器。

我猜你可以在纯javascript中做同样的事情：

inputElement.onclick = function(){ return false; };

但我没有测试它。

于 2012-07-27T17:35:21.820 回答
1

既然您已经有了执行 .submit() 的代码，为什么不将按钮类型更改为简单按钮而不是提交呢？

于 2011-09-28T02:01:32.443 回答
1

我不确定这是否是问题所在，但是，翻译成简单的英文后，您的代码似乎在说“单击提交按钮时，将 disabled 属性设置为 true，然后提交表单。”

但是，由于单击提交按钮已经提交了表单，因此您的浏览器可能会收到两个提交请求——一次是在您单击按钮时，第二次是在您的 javascript 告诉它提交时。

如果你不做 ajax，只是一个常规的提交，你应该能够return true代替调用submit- 本质上，告诉浏览器继续执行默认操作（即提交）。

或者真的，完全杀死整个submit()部分，因为它是多余的。

于 2011-09-28T02:02:18.680 回答
1

部分问题是我相信您提交了两次。您需要在开始第二个事件之前停止第一个事件。有关使用内联 javascript 停止事件的更多信息，请参阅此帖子：如何使用内联 onclick 属性停止事件传播？

于 2011-09-28T02:03:12.183 回答
1

当你使用

onclick="document.forms[0].submit();"

在提交按钮上，写input type="button"而不是type="submit"，

于 2012-12-15T10:43:40.203 回答
0

我们在 IE9 中遇到了同样的问题，我们通过将 event 的 cancelBubble 和 returnValue 标志分别设置为 true 和 false 来解决这个问题。

于 2014-03-21T11:40:58.803 回答