0

次のように、同期的に呼び出そうとする ajax アドレス検証関数があります。

function validate_address(address, city, state, zip) {
    return $.ajax({
        type: 'POST',
        url: '/ajax/address',
        data: {
            address: address,
            city: city,
            state: state,
            zip: zip
        },
        dataType: "json",
        cache: false,
        async: false
    }).responseText;
}

関数を呼び出す前に、回転する gif を表示し、関数の後に非表示にします。

$('#spinner').show();
var res = validate_address(address, city, state, zip);
$('#spinner').hide();

問題は、 ajax 呼び出しが完了した後に関数show()と関数の両方が呼び出されることです。hide()

サーバー側の ajax 呼び出しに 5 秒の遅延を追加して、これを確認しました。このシーケンスをトリガーしてから 5 秒後に、両方ともすぐに呼び出されましたshow()。hide()

あなたが私を呼び出す前に、同期リクエストが推奨されていないことを知っています. この場合、同期呼び出しを使用する必要があります。ここで何が起こっているのか、それを修正する方法を試しています。

4

2 に答える 2

3

すでに ajax 関数から deferred を返しているので、次を使用してdone()ください。

$('#spinner').show();
validate_address(address, city, state, zip).done(function(data) {
    res = data;
    $('#spinner').hide();
});

これは非同期リクエストでも機能しますか?

スピナーの表示がまだ遅く、ユーザー エクスペリエンスをさらに低下させたい場合は、いつでもコールバックを使用できます。

$('#spinner').show(1000, function() {
    validate_address(address, city, state, zip).done(function(data) {
        res = data;
        $('#spinner').hide();
    });
});
于 2012-12-11T23:36:17.600 に答える
0

何とajaxStart_ajaxEnd

この投稿を見てください：jQueryを使用して「お待ちください、読み込み中...」アニメーションを作成するにはどうすればよいですか? 

$("body").on({
    // When ajaxStart is fired, add 'loading' to body class
    ajaxStart: function() { 
        $(this).addClass("loading");  // or do what you need here 
    },
    // When ajaxStop is fired, rmeove 'loading' from body class
    ajaxStop: function() { 
        $(this).removeClass("loading"); // or do what you need here 
    }    
});
于 2012-12-11T23:44:21.027 に答える