ajax - BlockUI Ajax の読み込みが間違った瞬間

Question

これに関する別の投稿があることは知っています。しかし、答えはありません。

状況、私は ajax コマンドを持っています。手に入れたいものがあるので時間がかかります。

ajaxの実行の間にロードを含めたいです。

シンプルで見栄えが良いので、jquery BlockUIを使いたいです。

しかし、ajaxがデータ全体をロードするまで（「成功」が始まるときなど）、視覚効果が機能しない理由はわかりません。

複数の方法を試してみましたが、うまくいきません。

これが私の最後のコードです:

http://www.codeproject.com/Articles/382390/An-Example-to-Use-jQuery-Global-AJAX-Event-Handlerの関数

var AjaxGlobalHandler = {
Initiate: function(options) {
    $.ajaxSetup({ cache: false });

    // Ajax events fire in following order
    $(document).ajaxStart(function() {
        $.blockUI({
            message: options.AjaxWait.AjaxWaitMessage,
            css: options.AjaxWait.AjaxWaitMessageCss
        });
    }).ajaxSend(function(e, xhr, opts) {
    }).ajaxError(function(e, xhr, opts) {
        if (options.SessionOut.StatusCode == xhr.status) {
            document.location.replace(options.SessionOut.RedirectUrl);
            return;
        }

        $.colorbox({ html: options.AjaxErrorMessage });
    }).ajaxSuccess(function(e, xhr, opts) {
    }).ajaxComplete(function(e, xhr, opts) {
    }).ajaxStop(function() {
        $.unblockUI();
    });
}
}; 

コールレディ

        var options = {
            AjaxWait: {
                AjaxWaitMessage: '<h1 class="ui-overlay-loading-content"><img class="ui-overlay-loading-image" src="_inc/img/loading3circle1.gif" />Chargement des données ...</h1>',

                AjaxWaitMessageCss: { backgroundColor: '#ffffff' }
            },
            AjaxErrorMessage: "<h6>Erreur!/h6>"         
        };

        AjaxGlobalHandler.Initiate(options);

コールの実行

$.ajax({
                type: "POST",
                url: location.href.split('/').pop() + "?action=" + actionName + "&recherche=" + recherche,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(response) {
                    FillDataGridOnSuccess(response, gridId, dataTypeName);
                },
                error: function(xhr, ajaxOptions, thrownError) {
                    alert("xhr.status : " + xhr.status);
                    alert("thrownError : " + thrownError);
                }
            });    

私もやってみる

var ajaxSettings = function(options) {
    return $.extend(
        {
            beforeSubmit: function() {
            //beforeSend: function() {                
                $.blockUI({ overlayCSS: { backgroundColor: '#ffffff' },
                    message: '<h1 class="ui-overlay-loading-content"><img class="ui-overlay-loading-image" src="_inc/img/loading3circle1.gif" />Chargement des données ...</h1>'
                });
            },
            complete: function() {
                $.unblockUI();
            }
        },
        options
    );
};

私が行ったすべてのテストは、ajaxSuccess にのみ表示されるように見える読み込みで終了しました。

公式の blockUI サイトhttp://jquery.malsup.com/block/#demosにサンプル があり、そこで動作していることは知っていますが、自分ではできません。誰かが理由を見ましたか？

タンクあなた