xhd.ajax,保持浏览器处于加载状态，直到onLoad/Ajax结尾

你不能在浏览器的DOM加载状态的假扩展。一旦浏览器解析完整个HTML文档并完成加载所有样式表(标签)并加载并执行所有外部JavaScript文件(标签)，将调用window.onload函数(如果已分配)。

AJAX请求是异步的。虽然可以在DOM完全加载之前启动它们，但不能保证在加载DOM之前它们的响应会回来。为了实现你想要的东西(等到DOM被加载并且你的Ajax请求完成以触发其他函数)，你必须定期检查两者的状态。然后，您可以触发一个自定义事件，您可以绑定到JavaScript代码中的各个位置，因此您不必将所有自定义onLoad代码都放在一个位置。

例子：

var documentLoaded = false;

var ajaxLoaded = false;

$(document).ready(function() {

documentLoaded = true;

});

function simulateAjaxLoad() {

setTimeout(function() {

$('#ajax-content').html('Ajax Content Loaded');

ajaxLoaded = true;

}, 1000);

}

// asynchronous start the AJAX request before the DOM finishes loading

simulateAjaxLoad();

// periodically check for DOM ready and Ajax loaded

var loadStateTimer = setInterval(function() {

if(documentLoaded && ajaxLoaded) {

$(document).trigger('good-to-go'); // custom event

clearInterval(loadStateTimer); // stop checking, we're fully loaded

}

}, 100);

// utility function to log progress

function log(message) {

var logger = $('#log');

logger.html(logger.html() + message + "
");

}

// handle the custom event here

$(document).on('good-to-go', function() {

log("good-to-go event handled");

// some on-load code here

});

// ...

// handle the custom event somewhere else

$(document).on('good-to-go', function() {

log("good-to-go event handled here too");

// some other on-load code here

});

div {

width: 100%;

margin-bottom: 10px;

}

#ajax-content {

background: #eee;

min-height: 40px;

}