你的模拟操作本身就是有问题的,定时器虽然开了,但是并不会阻塞代码执行,因此你看到也就是瞬间的显示 隐藏效果,看不出来任何的效果,你应该在异步操作的执行回调中隐藏加载,比如ajax的回调sucess方法中,比如动画的结束回调,类似如下,定时器也只是做个简单的延迟,其实 本质上类似
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>javascript在一个function里控制loading的显示与隐藏</title><script type="text/javascript" language="javascript">
function longtimefunction(){
//开始显示loading
document.getElementById('loading').style.display='block';
var t=setTimeout(function(){
//在此之前进行的加载数据操作
//长耗时程序完成后,隐藏loading
document.getElementById('loading').style.display='none';
},4000);}
</script>
</head><body>
<div id="loading" style="color:red;display:none">Loading...</div>
<div id="bgDiv">
<h1>这里是网页标题</h1>
<p>这里是网页内容</p>
<p>这里是网页内容</p>
<p><a href="#" onClick="longtimefunction()">加载长耗时function</a></p>
</div>
</body>
</html>