IE9双表单提交问题
我只是想知道是否有人对我所处的情况有一些信息或反馈。 目前，我面临“双重表单提交”问题，我单击“提交”按钮一次，然后提交表单两次。这只发生在 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 兼容性问题列表？
谢谢！
I am just wondering if anyone have some info or feedback about the situation I am in.
Currently I am facing a "Double Form Submit" issue, where I click the "Submit" button once, and it submit the form twice. This only happens in IE9, but I have only tested against Safari, Chrome (Latest), FF (Ver 5/6), IE8, and IE9.
Here is the code:
<!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>
The problematic part is:
onclick="this.disabled=true;document.forms[0].submit();"
The code has been in my site for ages, and this is the first time I have encountered double submit problem since IE9 only releases this year, and probably these days more and more people using IE9, and hence I have received users complaints about this problem.
The hardest part is that the double submit problem is not always reproducible. Sometimes it will double submit, sometimes it will submit once.
My current work around is change from:
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
and change to:
<meta http-equiv="X-UA-Compatible" content="IE=8" >
This forces IE9 to use IE8 compatibility and it will execute the Javascript properly for for submission.
I have called Microsoft support, and they claim this is a "Javascript compatibility issue", so we will need to fine tune our Javascript to have our site work properly under IE9..(Duh!)
Anyway, is my code:
onclick="this.disabled=true;document.forms[0].submit();"
is already wrong to begin with? Because even though other browsers are not complaining, but probably this is not right to be begin with?
I am hoping if someone also faces similar issues have some more info or feedback.
Currently if I don't change X-UA-Compatible to IE=8, I can change my code to:
onclick="this.disabled=true;"
This will also solve the double submit issue, but is there also a list of IE9 compatibility issues that we should take note on?
Thanks!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（7）
这段代码是错误的：
onclick Javascript 不保证正常提交也不会执行。为此，它需要返回 false，如下所示：
此行为更改是否是 IE9 错误？这取决于时间问题导致的法律行为。如果 DOM/Javacript 标准保证 document.submit() 是文档中所有执行的结束，那么这只是一个错误。我怀疑情况是否如此。
This code is wrong:
The onclick Javascript does not guarantee that the normal submit will not execute as well. For that it needs to return false, like this:
Is this change in behavior an IE9 bug? It depends, this could depend on legal behavior that is the result of timing issues. It's only a bug if the DOM/Javacript standard guarantees that the document.submit() is the end of all execution in a document. I doubt that this is the case.
抽象出复杂性，问题似乎是 IE9 提交表单两次
当在 JavaScript 中触发提交事件时，单击一个按钮。
一般来说，我发现这样做可以修复 IE9 双
表单提交问题：
（IE9双重提交HTML失败）：
（IE9 html双重提交修复）：
所以基本上，我在javascript中处理表单提交（未显示）与事件侦听器（ click ），但在旧式事件处理程序（ onclick ）上返回 false ，即使您已经通过事件侦听器处理了它，IE9 似乎也会自动调用它。
我猜你可以在纯 javascript 中做同样的事情：
但我没有测试它。
Abstracting out the complexity, the issue seems to be that IE9 submits forms twice with
one button click when the submit event is fired in javascript.
In general, I found doing this fixes the IE9 double
form submission problem:
(failing IE9 double submission HTML):
<input type="submit" />(IE9 html double submission fix):
So basically, I am handling the form submission in javascript ( not shown) with an event listener ( click ) , but returning false on the old school event handler ( onclick) which IE9 seems to call automatically even if you have already handled it through an event listener.
I'm guessing you could do the same in pure javascript:
but I did not test it.
既然您已经有了执行 .submit() 的代码，为什么不将按钮类型更改为简单按钮而不是提交呢？
since you already have the code to perform .submit(), why not change the button type to simple button instead of submit?
我不确定这就是问题所在，但是，翻译成简单的英语，您的代码似乎是在说“单击提交按钮时，将禁用属性设置为 true，然后提交表单。”
但是，由于单击“提交”按钮已经提交了表单，因此您的浏览器可能会收到两个提交请求 - 一次是在您单击按钮时，第二次是在您的 javascript 告诉它提交时。
如果您不执行 ajax，只是常规提交，则应该能够返回 true，而不是调用提交 - 本质上，告诉浏览器继续执行默认操作操作（即提交）。
或者实际上，完全删除整个
submit()部分，因为它是多余的。I don't know for sure that this is the problem, but, translated to plain english, your code appears to be saying "On clicking the submit button, turn the disabled attribute to true, and then submit the form."
But, since clicking the submit button already submits the form, maybe your browser is receiving two requests to submit - once when you click the button, and the second time when your javascript tells it to submit.
If you are not doing ajax, just a regular submit, you should be able to
return trueinstead of callingsubmit- essentially, tell the browser to go ahead and do the default action (which is submit).Or really, kill the whole
submit()portion entirely, since it's redundant.部分问题在于我相信您提交了两次。您需要先停止第一个事件，然后再开始第二个事件。有关使用内联 javascript 停止事件的更多信息，请参阅此文章：如何使用内联 onclick 属性停止事件传播？
Part of the problem is that I believe you're submitting twice. You need to stop the first event before you start the second. See this post for more information on stopping events using inline javascript: How to stop event propagation with inline onclick attribute?
使用
onclick="document.forms[0].submit();"当您在提交按钮上 时，请编写
input type="button"而不是type =“提交”，When you use
onclick="document.forms[0].submit();"on the submit button, write
input type="button"instead oftype="submit",我们在 IE9 中遇到了同样的问题，我们通过将事件的 cancelBubble 和 returnValue 标志分别设置为 true 和 false 来解决该问题。
we had the same problem in IE9 and we solved the issue by setting cancelBubble and returnValue flags of event to true and false respectively.