javascript - 我可以让我的 Ajax 调用导致出现 "in-progress"光标吗？

Question

我有以下代码:

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

有没有一种方法可以改变它，以便一旦 Ajax 调用开始，光标就会改变形状，以指示操作正在进行，并在调用停止后让光标恢复到默认状态？

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' );
        }
    });

使光标移动到整个 body 上的忙碌动画。