1

次のようなものがあるとします。

$('button').live({
    click: function() {
        $('body').css('cursor', 'wait');
        var value = 1;
        $.ajax({
            type: 'GET',
            url: 'http://www.domain.com/site/index.php/controller/function',
            dataType: 'json',
            cache: false,
            async: false,
            data: { variable: value },
            success: function(data, textStatus, jqXHR) { // },
            error: function(jqXHR, textStatus, errorThrown) { // }
        });
        $('body').css('cursor', 'default');
    }
});

AJAX リクエストが応答を返すのに数分かかるため、カーソルを変更しようとしています。ユーザーがブラウザがクラッシュしたなどと思わないようにする必要があります。問題は、このコードの行が機能しないことです。

何か案は？

補足: AJAX リクエストに問題はありません。すべて正常に動作します。

4

4 に答える 4

1

私はこれで終わった：

$('button').live({
    click: function() {
        console.log('change cursor...')
        $('body').css('cursor', 'wait');
        console.log('cursor changed, wait 1 second...')
        setTimeout(function() {
            console.log('make ajax request...')
            $.ajax({
                type: 'GET',
                url: 'http://www.domain.com/site/index.php/controller/function',
                async: false,
                success: function(data, textStatus, jqXHR) {
                    console.log('change cursor back...')
                    $('body').css('cursor', 'default');
                },
                error: function(jqXHR, textStatus, errorThrown) { // }
            });
        }, 1000);
    }
});

テスト済みで動作中

于 2013-04-04T13:18:46.617 に答える
0

この質問に対する受け入れられた回答に従って、これを試すことができます。

$('body').ajaxStart(function() {
    $(this).css({'cursor':'wait'})
}).ajaxStop(function() {
    $(this).css({'cursor':'default'})
});

ページ上のすべての AJAX 呼び出しに対してカーソルが変更されます。

于 2013-04-03T20:38:41.360 に答える