javascript - Firefox 似乎在更新 DOM 之前等待异步 ajax 完成

Question

我编写了以下函数来从日志文件中获取文本并在新的浏览器窗口中将其显示为纯文本:

function openLog(logFile) {
    var win = window.open('', '_blank');
    var doc = win.document;
    var title = doc.createElement('TITLE');
    var titleText = doc.createTextNode(logFile);
    title.appendChild(titleText);
    doc.head.appendChild(title);
    doc.body.style.cursor='wait';

    $.ajax({
        type: 'GET',
        url: '/getLog',
        data: { logFile : logFile },
        success: function(log) {                
            var pre = doc.createElement('PRE');
            var preText = doc.createTextNode(log);
            pre.appendChild(preText);
            doc.body.appendChild(pre);
            doc.body.style.cursor='default';
        },
        error: function() {
            doc.body.style.cursor='default';
        }
    });
};

“等待”光标对于大型日志文件非常有用。

在 Chrome/IE 中，当异步 ajax 请求在后台运行时，“等待”光标会立即显示。在 Firefox 中，只显示“默认”光标，因为它似乎在等待 ajax 函数首先完成(一旦完成，它就会设置回“默认”)。

Firefox 中有解决此问题的方法吗？如有任何建议，我们将不胜感激。

Answer 1

我很惊讶它可以在任何浏览器中工作 - 新打开的窗口的主体内容为零，因此大小为零 - 如何“悬停”在任何内容上以使当前光标更改为指定的光标？我认为 Firefox 是唯一运行正常的浏览器!!

话虽这么说 - 虚拟代码

function openLog(logFile) {
    var win = window.open('', '_blank');
    var doc = win.document;
    var title = doc.createElement('TITLE');
    var titleText = doc.createTextNode(logFile);
    title.appendChild(titleText);
    doc.head.appendChild(title);
    // change from here
    var html = doc.documentElement;
    html.style.cursor = 'wait';
    html.style.minHeight = '100vh';
    // changes finished
    //
    // dummy setTimeout for testing
    setTimeout(function () {
        // remove the cursor from HTML element
        html.style.cursor = 'default';
    }, 4000);
};
openLog('banana');

我会将其作为可执行代码片段发布，但谁愿意允许 SO 为此打开弹出窗口:p

我使用 body.parentElement (即 HTML 元素) - 因为对 body 执行此操作最终会出现垂直滚动条