jquery - 为什么尝试使用 JQuery 在 IE 中更改按钮上的文本时会有时间延迟？

Question

我有一些在单击按钮时运行的 Ajax。有时它需要几秒钟才能返回，所以我想给用户一个视觉线索，让用户知道浏览器正在做某事。

所以，我有这个：

    $('#SubmitButton').attr("value", "Working...");
    $('#SubmitButton').attr("disabled", true);

    //Synchronous Ajax call goes here

    $('#SubmitButton').attr("value", "Submit");
    $('#SubmitButton').attr("disabled", false);

如您所见，它会更改按钮上的文本并禁用它。当 Ajax 调用返回时（它是同步的，记住），按钮变回来。

在 Firefox 中，这很好用。

在 IE 中，它是……奇怪的。它不会按顺序运行代码。它不会更改按钮的文本并直接启动到 Ajax 调用中。浏览器阻止提交活动并说“提交”。

Ajax 返回后，按钮快速闪烁“工作中...”，然后返回提交。”

因此，出于某种原因，IE 直到Ajax 调用之后才更改按钮的文本，即使它的代码在 Ajax 调用之前也是如此。

它的行为是这样的：

    //Synchronous Ajax call goes here

    $('#SubmitButton').attr("value", "Working...");
    $('#SubmitButton').attr("disabled", true);

    $('#SubmitButton').attr("value", "Submit");
    $('#SubmitButton').attr("disabled", false);

同样，这在 Firefox 中完美运行。但是在 IE 中，有某种...滞后？

Answer 1

在进行同步调用之前，浏览器可能没有时间更新它。尝试这个：

$('#SubmitButton').attr("value", "Working...");
$('#SubmitButton').attr("disabled", true);

window.setTimeout(function(){
    // Synchronous Ajax call goes here

    $('#SubmitButton').attr("value", "Submit");
    $('#SubmitButton').attr("disabled", false);
}, 100);