11

詳細：

  • ユーザーが送信ボタンをクリックした後、サーバーに投稿する前にのみ無効にします
  • ASP.NET Webフォーム（.NET 1.1）
  • jQueryを優先する（ライブラリがある場合）
  • フォームをリロードする場合（つまり、クレジットカードが失敗した場合）は有効にする必要があります

これは私がこれを行う必要はありませんが、あまり変更せずにそれを行う簡単な方法があれば、私はそれを行います。（つまり、簡単な解決策がない場合、私はおそらくそれをしませんので、深く掘り下げることを心配しないでください）

4

7 に答える 7

12

すべての送信ボタンの場合、JQuery 経由では次のようになります。

$('input[type=submit]').click(function() { this.disabled = true; });

または、フォームの送信時に行う方が便利な場合があります。

$('form').submit(function() {
    $('input[type=submit]', this).attr("disabled","disabled");
});

しかし、文脈についてもう少し知っていれば、あなたの質問により良い答えを出すことができると思います.

これが ajax リクエストの場合は、成功または失敗のいずれかで送信ボタンを再度有効にする必要があります。

これが標準の HTTP フォーム送信 (javascript でボタンを無効にすることは別として) であり、同じフォームの複数の送信から保護するためにこれを行っている場合は、コードで何らかの制御を行う必要があります。 JavaScript でボタンを無効にしても、複数の送信を防止できない可能性があるためです。

于 2008-09-05T16:05:04.677 に答える
8

次のようなことができます。

$('form').submit(function() {
    $(this)
        .find(":submit,:image")             // get all the submit buttons
        .attr({ disabled : 'disabled' })    // disable them
        .end()                              // go back to this form
        .submit(function() {                // change the onsubmit to always reject.
            return false;
        })
    ;
});

これの利点:

  • すべてのフォーム、すべての提出方法で機能します。
    • 送信要素をクリックする
    • Enter キーを押す、または
    • form.submit()他のコードからの呼び出し
  • すべての送信要素を無効にします。
    • <input type="submit"/>
    • <button type="submit"></button>
    • <input type="image" />
  • 本当に短いです。
于 2008-10-30T07:57:29.687 に答える
5

送信の処理中に送信ボタンを複数回押したくないのではないかと思います。

私のアプローチは、ボタンを完全に非表示にし、代わりにある種のステータス インジケーター (アニメーション GIF など) を表示することでした。

これは非常に不自然な例です（技術的にはプロトタイプですが、jqueryバージョンは非常に似ていると思います）：

<html>
    <head>
        <script type="text/javascript" src="include/js/prototype.js"></script>

        <script type="text/javascript">
            function handleSubmit()
            {
                $('submit').hide();
                $('progressWheel').show();
                return true;
            }
        </script>
    </head>
    <body>
        <img src="include/images/progress-wheel_lg.gif" id="progressWheel" style="display:none;"/>
        <input type="submit" name="submit" id="submit" value="Submit" onclick="handleSubmit();"/>
    </body>
</html>
于 2008-09-05T16:08:22.580 に答える
1

JQueryの場合：

$('#SubmitButtonID').click(function() { this.disabled = true; });
于 2008-09-05T15:46:53.830 に答える
1

注意すべきことは、フォームが送信される前にボタンを無効にしないでください。OnClick イベントで JavaScript を使用してボタンを無効にすると、フォームの送信が失われる可能性があります。

そのため、JavaScript を使用してボタンの上に画像を配置するか、ボタンを表示範囲外に移動して、ボタンを非表示にすることをお勧めします。これにより、フォームの送信が正常に進行できるようになります。

于 2008-10-30T07:21:38.717 に答える
0

対象となるフォームを送信するには、3 つの方法があります。David McLaughlin と Jimmy の両方の提案を使用してください。1 つは送信ボタンのフォーム要素を無効にし、もう 1 つは基本的な HTML フォームの送信を無効にします。

3 つ目は、Javascript による form.submit() の実行を無効にしません。このOnSubmit="return false"メソッドは、ユーザーが送信ボタンをクリックするか、入力フォーム要素で Enter キーを押したときにのみ適用されます。クライアント側のスクリプトも処理する必要があります。

于 2008-09-05T16:05:08.797 に答える
0

どうですか

コードビハインド:

btnContinue3.Attributes.Item("onclick") = "disableSubmit()"

Javascript :

function disableSubmit() {
    document.getElementById('btnContinue3').onclick = function() { 
        alert('Please only click once on the submit button!'); return false;
    };
}

これは、ポストバックがタイムアウトした場合に何が起こるかという問題を解決しませんが、それ以外はうまくいきました。

于 2008-10-30T06:40:13.150 に答える