我确定之前已经被问了1000次,基本上我想要做的就是更改页面元素的内容以显示加载消息,同时我的其他javascript代码(资源非常密集)完成.问题是在"其他JS处理"完成之后,消息不会显示,从而完全违背其目的.一个简化的例子......
<html>
<head>
<title> crappity crapness </title>
<script type="text/javascript">
function showMessage(){
document.getElementById("content").innerHTML = "please wait while we waste some time";
}
function wasteTime(){
//alert("oh joy");
pausecomp(3000);
//alert("marvelous!");
}
function pausecomp(millis)
{
var date = new Date();
var curDate = null;
do { curDate = new Date(); }
while(curDate-date < millis);
}
</script>
</head>
<body>
<div id="content">Blah</div>
<br/>
<a href="http://www.google.com" onclick="showMessage(); wasteTime();"> link </a>
</body>
Run Code Online (Sandbox Code Playgroud)
如果我取消注释"哦欢乐"警报,则div中的文本会立即更新.如何在没有警报的情况下使其工作?
我知道我一定会错过一些简单的事情.谢谢
听起来你反对Javascript是单线程的事实,但浏览器不是.
基本上,您不能同时运行多个Javascript.但是,浏览器仍然必须执行除执行Javascript之外的事情,并在可能的情况下继续执行此操作.问题是,是否定义了修改DOM是同步的(即JS执行停止直到完成)还是异步(JS执行继续).大多数浏览器都使用后者.但JS执行仍然具有相当高的优先级,并且许多DOM更新被推迟到JS执行必须停止并等待.警报框是一个很好的例子,因为它正在等待用户输入.
做你想做的事情的方法是利用setTimeout()它让当前的JS完成,然后浏览器可以完成更新DOM,然后它可以执行JS等待超时运行.