1

所以在我的网站上有一个 Javascript 函数，它将通过 XMLHttpRequest 从服务器加载一个新网站。之后，它将当前页面替换为新页面：

var post = new XMLHttpRequest();
post.open('POST', data);
post.onload = function() {
    var do = document.open("text/html", "replace");
    do.write(post.responseText);
    do.close();
    goOn();
}

function goOn() {
    console.log($('img:visible'));
}

有些人可能会假设在 do.close() 之后文档已更改并准备就绪。但事实并非如此，例如，如果我加载非常多/大数据/responseText 函数 goOn() 只会记录一个空结果。显然 goOn() 在 DOM 准备好被读取之前被调用！不幸的是，在 write() 完成后没有触发“就绪”事件......我怎么能确定它已经完成？

/EDIT: goOn() 将此记录到 Chrome 控制台：

[prevObject: p.fn.p.init[1], context: #document, selector: "img:visible"]
context: #document
length: 0
prevObject: p.fn.p.init[1]
selector: "img:visible"
__proto__: Object[0]

但是，如果我在手动输入 $('img:visible') 到控制台之后，它会向我显示所有图像......

4

1 回答 1

2

您是否尝试将准备好的事件附加到您的文档中，您可以尝试以下操作，

var post = new XMLHttpRequest();
post.open('POST', data);
post.onload = function() {
    var do = document.open("text/html", "replace");
    $(do).ready(function () { goOn(); });
    do.write(post.responseText);
    do.close();

}

function goOn() {
    console.log($('img:visible'));
}

编辑：

是的，我在 fiddler 上试过，但是下面和这里有 JS 事件

var docx = document.open();
docx.onreadystatechange = function () { alert(this.readyState) };
alert(docx);
docx.write("<div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div>");

docx.close();​

之后只需检查就绪状态并在它时做你的事情complete。

我认为这个可以解决问题。

于 2012-12-10T22:45:41.580 回答