jquery - 在等待帖子回复时添加加载图像

Question

我想在等待 jquery 中帖子的响应时添加加载图像或更改鼠标光标。

jQuery

$.post(url,data,
    function(response){
    //add a loading cursor to indicate that it is waiting for a response?
    alert(response);
});

我需要这个，因为响应需要很长时间才能弹出。

任何想法？谢谢

Answer 1

这是一个使用 $.ajax() 的选项。您需要在 DOM 中定义隐藏的 loadingImage。

        $.ajax({                                                                                                           
            type:'POST',                                                                                                   
            ...                                                                                                           
            beforeSend:function(){                                                                                         
                $('.loadingImg').show();                                                                                
            },                                                                                                             
            complete:function(){                                                                                           
                $('.loadingImg').hide();                                                                    
            },                                                                                                             
            ...                                                                                                                                                         
        });

Answer 2

在 ajax 调用之前更改光标，然后在成功处理程序中更改回：

$('body').css('cursor','wait');

$.post(url,data, function(response){
    $('body').css('cursor','default');
});

如果你使用 $.ajax 你有更多的选择：

$.ajax({
    url : url,
    data: data,
    type: 'POST',
    beforeSend: function() {
        $('body').css('cursor','wait');
    }
}).done(function(data) {
    // do something with data
}).fail(function() {
    console.log('error');
}).always(function() {
    $('body').css('cursor','default');
});

同样的逻辑适用于加载图像或您决定添加的任何内容？