使用JavaScript锚标记的文本不会更改

Question

我执行了一个耗时3秒以上的ajax函数，因此这次我希望将链接的文本（下面的代码以及图像中的1）更改为“ Please wait ...”。 我在下面尝试了JavaScript代码，但是发生的是文本没有更改，并且该函数正常执行。 请有人指出我的错误。

HTML：

<a id="emailGarageList" href="javascript:EmailGarageList(347)">Email Garage List...</a>

屏幕截图：

Javascript：

function EmailGarageList(fId) {
    $('#emailGarageList').text('Please wait...');
    $.ajax({
        type: "POST",
        url: "Default.aspx/EmailGarageList",
        data: "{'fId':" + fId + ",'userId':" + userId + "}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            alert("Garage List Emailed!");
        },
        error: function () {
            alert("Error :(");
        }
    });
    $('#emailGarageList').text('Email Garage List...');
};

Answer 1

把$('#emailGarageList').text('Email Garage List...'); 在您的成功功能中。 否则，它会改变，然后又变回来。

Answer 2

移动$('#emailGarageList').text('Email Garage List...'); 内$ .ajax回调函数。 $ .ajax是一个异步调用，在完成ajax调用之前，您下面的文本会立即更新。

function EmailGarageList(fId) {
    $('#emailGarageList').text('Please wait...');
    $.ajax({
        type: "POST",
        url: "Default.aspx/EmailGarageList",
        data: "{'fId':" + fId + ",'userId':" + userId + "}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            alert("Garage List Emailed!");
            $('#emailGarageList').text('Email Garage List...');
        },
        error: function () {
            alert("Error :(");
        }
    });    
};

Answer 3

我的猜测是jQuery Mobile（我假设您正在使用）正在修改DOM sso，因此您的选择器无法以您认为的方式找到$（'＃emailGarageList'）。

Answer 4

我认为您正在寻找beforeSend回调 ：

$.ajax({
    // other stuff ...
    beforeSend: function () {
        $('#emailGarageList').text('Please wait...');
    }
});