我可以进行Ajax调用导致出现“正在进行中”的光标吗？

Question

我有以下代码：

    $("header")
    .on({
        ajaxStart: function () {
            $(this).addClass("ajax-loading");
        },
        ajaxStop: function () {
            $(this).removeClass("ajax-loading");
        }
    });

有没有办法让我可以改变它，这样一旦Ajax调用开始，光标就会改变形状，指示一个动作正在进行并且在调用停止后让光标返回默认值？ / p>

Answer 1

尝试;

$("header")
    .on({
        ajaxStart: function () {
            $(this).css( 'cursor', 'progress' );
        },
        ajaxStop: function () {
            $(this).css( 'cursor', 'default' );
        }
    });

将光标移到标题上的忙动画上。你可以尝试

$("header")
    .on({
        ajaxStart: function () {
            $('body').css( 'cursor', 'progress' );
        },
        ajaxStop: function () {
            $('body').css( 'cursor', 'default' );
        }
    });

将光标移动到整个身体上的繁忙动画。

Answer 2

您可以使用beforeSend参数：

$.ajax({
  beforeSend: function() { //function to do whatever you want to do; }
});