1

ページを更新せずに、AJAXを使用してバックグラウンドでフォームを送信しています。私が直面している問題は、フォームを1回しか送信できないことです。一度送信すると、on（'submit'）関数が機能しなくなり、エラーが発生しなくなります。これは、AJAXを使用してフォームを送信するという目的を完全に無効にします：/

           $(document).on('submit', '#myForm', function(e) {
                $.post('mail.php', $(this).serialize(), function (data) {
                    //SUCCESS
                    $('.successORfail').html(data);
                     setTimeout(function(){
                      $(".successORfail").fadeOut("slow", function () {
                        $(".successORfail").remove();
                      });
                    }, 4500);

                }).error(function() {
                    alert("Fatal Error: mail.php not found!");
                });
                e.preventDefault();
            });

誰かが同様の問題に遭遇したのか、それともこれを解決する方法を知っているのか疑問に思いましたか？フォームを複数回送信できるようにしたいのですが、必要に応じて、送信するたびにフォームの入力値を変更します。

よろしくお願いします

4

5 に答える 5

2

AJAXリクエストが発生していないことを確認しますか？ページから要素を削除しているように見える.successORfailため、以降の呼び出しでコンテンツを追加するものはありません。

コンソールを確認すると、おそらく毎回ajax呼び出しが発生していることに気付くでしょう。

setTimeoutを次のように変更してみてください。

var msgEl = $(".successORfail");
setTimeout(function() {
    msgEl.fadeOut("slow", function () {
        msgEl.empty().show();
    });
}, 4500);
于 2013-01-09T13:51:38.293 に答える
1

成功イベントハンドラー：

$('.successORfail').html(data);
setTimeout(function () {
  $(".successORfail").fadeOut("slow", function () {
    $(".successORfail").remove();
  });
}, 4500);

.successORfail要素（ ）にコンテンツを設定してから、その要素を削除します。次にフォームを送信すると、正常に応答が返され、その関数が実行されると、コンテンツを設定する要素がなくなったため、何も変更されません。

于 2013-01-09T13:51:42.577 に答える
1

要素を削除する代わりに.hide()、次に入力できるようにするためだけに削除します。あなた.show()も毎回それをする必要があるでしょう。

       $(document).on('submit', '#myForm', function(e) {
            $.post('mail.php', $(this).serialize(), function (data) {
                //SUCCESS
                $('.successORfail').html(data).show(); //<-- show

                 setTimeout(function(){
                  $(".successORfail").fadeOut("slow", function () {
                    $(this).hide(); //<-- hide
                  });
                }, 4500);

            }).error(function() {
                alert("Fatal Error: mail.php not found!");
            });
            e.preventDefault();
        });

また、関数では、クラス名に基づいて要素を再選択する代わりに、でfadeOut()要素にアクセスできます。$(this)

于 2013-01-09T13:55:38.337 に答える
0

HTMLスニペットを追加できますか？$（'。successORfail'）。html（data）;を介してフォームを置き換える場合は、html構造に関する知識がないと役に立ちません。リスナーはフォームに再バインドされません。form-dataはjavascriptを介して送信されるため、FALSEも返す必要があります。

于 2013-01-09T13:51:41.177 に答える
0

さて、あなたはあなたの結果をに追加し、それを$('.successORfail').html(data);削除するようです。以下を取り出して、複数回動作するはずです...

$('.successORfail').remove();

その要素がないと、変更を加えることはできません。

于 2013-01-09T13:51:56.207 に答える