1

小さな（または大きな）問題が再び発生

私は単純な html フォームを使用しています。送信アクションで php (メール) スクリプトを呼び出します。別のメールを送信する前にいくつかの時間制限があるため、このスクリプトが完了するまでに少し時間がかかります。空白をロードすることを期待していました。ページ、または少なくともループの前にすべてを表示します。完成したら、ページにすべての出力を読み込みます..だから、この読み込み画像を作成する方法をいくつか調べ始めました..または、少なくとも何かが起こっていること、およびスクリプトが機能していることをユーザーに知らせます。

スタックオーバーフローに関するいくつかのものを見て、これを含めました。これは、送信ボタンがある場所に読み込み中の画像を表示するはずでしたが、フォームでページを読み込んでいないため、機能しないと思います..しかし、実行中php ループですが、期待してとにかくそれを見てもらいます.. 何か:

$('#loading_image').show(); // show loading image, as request is about to start
$.ajax({
url: '..',
type: '..',
complete: function() {
    // request is complete, regardless of error or success, so hide image
    $('#loading_image').hide();
}
});
$('#myform').submit(function() {
$('#loading_image').show(); // show animation
return true; // allow regular form submission
});

そして私のフォーム

<form method="post" action="sendeveryone.php" id="myform" onReset="return confirm('Do you really want to reset the form?')">
                    <fieldset>
                    Please note:  All e-mails start with "Dear {MEMBER_NAME}, " If you would like to mention their username in the body of your email, all you have to do is type '{MEMBER_NAME}' and it will replace it to their username.<br><br>
                    <br>
                        <label class="control-label" for="subject">Subject</label>

                            <input id="subject" name="subject" class="span5" type="text">

                 <label class="control-label" for="body">Body</label>

<div class="row-fluid">
    <div class="utopia-widget-content-nopadding">
        <div class="span12 text-editor">
            <textarea id="input" name="input"></textarea>
        </div>
    </div>
 </div>

<br><img src="myloadingimage.gif" style="display: none;" id="loading_image">

                    <button class="btn btn-large btn-primary span5" type="submit">Send</button>
                    <button class="btn btn-large span5" type="reset">Cancel</button>

                    </fieldset>
                    </form>
4

1 に答える 1

0

jQueryで メソッド.ajaxStart()とメソッドを使用できます.ajaxStop()

$('.log').ajaxStart(function() {
    $(this).text('Triggered ajaxStart handler.');
});
于 2012-07-08T04:45:33.757 に答える