14

私がいる状況について誰かが情報やフィードバックを持っているかどうか疑問に思っています. これは IE9 でのみ発生しますが、Safari、Chrome (最新)、FF (Ver 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 を使用する人がますます増えているため、この問題についてユーザーから苦情を受けています。 .

最も難しいのは、二重送信の問題が常に再現可能であるとは限らないことです。2 回送信される場合もあれば、1 回送信される場合もあります。

私の現在の回避策は、次の変更です。

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

次のように変更します。

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

これにより、IE9 は IE8 との互換性を使用するようになり、送信のために Javascript が適切に実行されます。

マイクロソフトのサポートに電話したところ、これは「Javascript の互換性の問題」であるとのことでした。そのため、サイトが IE9 で適切に動作するように Javascript を微調整する必要があります..(当たり前!)

とにかく、私のコードです：

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 で送信イベントが発生したときに、1 回のボタンクリックで IE9 がフォームを 2 回送信することが問題のようです。

一般に、これを行うと 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

使用するとき

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

送信ボタンに、 のinput type="button"代わりに書きますtype="submit"。

于 2012-12-15T10:43:40.203 に答える
1

.submit() を実行するコードは既にあるので、ボタンの種類を送信ではなく単純なボタンに変更してみませんか?

于 2011-09-28T02:01:32.443 に答える
1

これが問題なのかどうかはわかりませんが、平易な英語に翻訳すると、コードは「送信ボタンをクリックしたら、disabled 属性を true にしてからフォームを送信してください」と言っているように見えます。

しかし、送信ボタンをクリックするとすでにフォームが送信されているため、ブラウザは 2 つの送信要求を受け取っている可能性があります。

ajax を実行しておらず、通常の送信のみを行っている場合はreturn true、呼び出す代わりにsubmit、ブラウザーに先に進み、既定のアクション (送信) を実行するように指示する必要があります。

または、実際には、submit()冗長であるため、部分全体を完全に削除します。

于 2011-09-28T02:02:18.680 に答える
1

問題の一部は、あなたが 2 回提出していると思われることです。2 番目のイベントを開始する前に、最初のイベントを停止する必要があります。インライン JavaScript を使用してイベントを停止する方法の詳細については、この投稿を参照してください:インライン onclick 属性を使用してイベントの伝播を停止する方法?

于 2011-09-28T02:03:12.183 に答える
0

IE9 でも同じ問題があり、イベントの cancelBubble フラグと returnValue フラグをそれぞれ true と false に設定することで問題を解決しました。

于 2014-03-21T11:40:58.803 に答える