Изменить курсор во время работы AJAX

Question

У меня есть поле и кнопка, которые выполняют поиск с помощью AJAX.Я хотел бы, чтобы курсор изменился на «прогресс» во время выполнения поиска, а затем обратно на «по умолчанию», когда он будет завершен.

function getFromFile(pFilePath, pFileName, pParseType) {
    var vCompletePath = pFilePath + pFileName;

    $.ajax({
        beforeSend: function(){$("body").css("cursor","progress");},
        type: "GET",
        url: vCompletePath,
        dataType: pParseType,
        async: false,
        success: function(data) {
            console.log("Data retrieval was successful!");
            aReturnedContent = data;
        },
        error: function() {
            console.log("Data retrieval was unsuccessful!");
        },
        complete: function(){$("body").css("cursor","default");}
    });
}

Я пробовал несколько вещей (включая настройки beforeSend и complete), но ничего не работает.Есть мысли?

Спасибо!

Answer 1

Вы можете установить свой курсор следующим образом (то же самое в загрузчике на странице):

function getFromFile(pFilePath, pFileName, pParseType) {
    var vCompletePath = pFilePath + pFileName;

    $("body").style.cursor = "progress";
    $.ajax({
        type: "GET",
        url: vCompletePath,
        dataType: pParseType,
        async: false,
        success: function(data) {
            console.log("Data retrieval was successful!");
            aReturnedContent = data;
            $("body").style.cursor = "default";
        },
        error: function() {
            console.log("Data retrieval was unsuccessful!");
            $("body").style.cursor = "default";
        }
    });
}

, если не работал в jQuery:

function getFromFile(pFilePath, pFileName, pParseType) {
    var vCompletePath = pFilePath + pFileName;

    document.body.style.cursor = "progress";
    $.ajax({
        type: "GET",
        url: vCompletePath,
        dataType: pParseType,
        async: false,
        success: function(data) {
            console.log("Data retrieval was successful!");
            aReturnedContent = data;
            document.body.style.cursor = "default";
        },
        error: function() {
            console.log("Data retrieval was unsuccessful!");
            document.body.style.cursor = "default";
        }
    });
}