100分求页面加载时显示"数据加载中"显示框的实现
日期：2014-05-18 浏览次数：20525 次
100分求页面加载时显示"数据加载中"显示框的实现。高手请进
如何实现在页面加载时显示 "数据加载中 "显示框,等页面数据加载完了，关闭显示框，显示页面.
------解决方案--------------------
效果： http://www.followgo.cn
------解决方案--------------------
wang520d(Q) ( ) 信誉：100 2007-08-16 14:40:57 得分: 0
效果： http://www.followgo.cn
－－－－－－－－－－－－－－－－
的js代码是：
<script language= "JavaScript ">
//读取框
var t_id = setInterval(animate,20);
var pos=0;
var dir=2;
var len=0;
function animate()
{
var elem = document.getElementById( 'progress ');
if(elem != null) {
if (pos==0) len += dir;
if (len> 32 || pos> 79) pos += dir;
if (pos> 79) len -= dir;
if (pos> 79 && len==0) pos=0;
elem.style.left = pos;
elem.style.width = len;
}
}
function remove_loading() {
this.clearInterval(t_id);
var targelem = document.getElementById( 'loader_container ');
targelem.style.display= 'none ';
targelem.style.visibility= 'hidden ';
}
</script>
<body onLoad= "remove_loading(); ">
<div id= "loader_container ">
<div id= "loader ">
<div align= "center "> 页面正在加载中 ... </div>
<div id= "loader_bg "> <div id= "progress "> </div> </div>
</div>
</div>
当然，你要是ajax的话，就判断state＝＝０｜｜state＝＝１｜｜state＝＝２｜｜state＝＝３
的时候，让一个div.innerＨＴＭＬ＝＂数据载入中ing．．．＂；就可以了
------解决方案--------------------
在Page_Load事件里输入： Visual C# .NET代码
Response.Write( " <div id= 'mydiv ' > ");
Response.Write( "_ ");
Response.Write( " </div> ");
Response.Write( " <script> mydiv.innerText = ' '; </script> ");
Response.Write( " <script language=javascript> ; ");
Response.Write( "var dots = 0;var dotmax = 10;function ShowWait() ");
Response.Write( "{var output; output = '正在装载页面 ';dots++;if(dots> =dotmax)dots=1; ");
Response.Write( "for(var x = 0;x < dots;x++){output += '· ';}mydiv.innerText = output;} ");
Response.Write( "function StartShowWait(){mydiv.style.visibility = 'visible '; ");
Response.Write( "window.setInterval( 'ShowWait() ',1000);} ");
Response.Write( "function HideWait(){mydiv.style.visibility = 'hidden '; ");
Response.Write( "window.clearInterval();} ");
Response.Write( "StartShowWait(); </script> ");
Response.Flush();
Thread.Sleep(10000);
在ShowProgress.aspx窗体的html的中输入：
<script>
HideWait();
</script>
------解决方案--------------------
可以用UpdatePanel+UpdateProgess实现
------解决方案--------------------
是不是想要加载条页面那种.是的话下面可以满足..
首先新建一下HTML页面源代码如下:
<head>
<title> 无标题页 </title>
<script language= "javascript " type= "text/javascript ">
function SetPorgressBar(pos)
{
//设置进度条居中
var screenHeight = window[ "mainWindow "].offsetHeight;
var screenWidth = window[ "mainWindow "].offsetWidth;
ProgressBarSide.style.width = Math.round(screenWidth / 4);
如何实现在页面加载时显示 "数据加载中 "显示框,等页面数据加载完了，关闭显示框，显示页面.
------解决方案--------------------
效果： http://www.followgo.cn
------解决方案--------------------
wang520d(Q) ( ) 信誉：100 2007-08-16 14:40:57 得分: 0
效果： http://www.followgo.cn
－－－－－－－－－－－－－－－－
的js代码是：
<script language= "JavaScript ">
//读取框
var t_id = setInterval(animate,20);
var pos=0;
var dir=2;
var len=0;
function animate()
{
var elem = document.getElementById( 'progress ');
if(elem != null) {
if (pos==0) len += dir;
if (len> 32 || pos> 79) pos += dir;
if (pos> 79) len -= dir;
if (pos> 79 && len==0) pos=0;
elem.style.left = pos;
elem.style.width = len;
}
}
function remove_loading() {
this.clearInterval(t_id);
var targelem = document.getElementById( 'loader_container ');
targelem.style.display= 'none ';
targelem.style.visibility= 'hidden ';
}
</script>
<body onLoad= "remove_loading(); ">
<div id= "loader_container ">
<div id= "loader ">
<div align= "center "> 页面正在加载中 ... </div>
<div id= "loader_bg "> <div id= "progress "> </div> </div>
</div>
</div>
当然，你要是ajax的话，就判断state＝＝０｜｜state＝＝１｜｜state＝＝２｜｜state＝＝３
的时候，让一个div.innerＨＴＭＬ＝＂数据载入中ing．．．＂；就可以了
------解决方案--------------------
在Page_Load事件里输入： Visual C# .NET代码
Response.Write( " <div id= 'mydiv ' > ");
Response.Write( "_ ");
Response.Write( " </div> ");
Response.Write( " <script> mydiv.innerText = ' '; </script> ");
Response.Write( " <script language=javascript> ; ");
Response.Write( "var dots = 0;var dotmax = 10;function ShowWait() ");
Response.Write( "{var output; output = '正在装载页面 ';dots++;if(dots> =dotmax)dots=1; ");
Response.Write( "for(var x = 0;x < dots;x++){output += '· ';}mydiv.innerText = output;} ");
Response.Write( "function StartShowWait(){mydiv.style.visibility = 'visible '; ");
Response.Write( "window.setInterval( 'ShowWait() ',1000);} ");
Response.Write( "function HideWait(){mydiv.style.visibility = 'hidden '; ");
Response.Write( "window.clearInterval();} ");
Response.Write( "StartShowWait(); </script> ");
Response.Flush();
Thread.Sleep(10000);
在ShowProgress.aspx窗体的html的中输入：
<script>
HideWait();
</script>
------解决方案--------------------
可以用UpdatePanel+UpdateProgess实现
------解决方案--------------------
是不是想要加载条页面那种.是的话下面可以满足..
首先新建一下HTML页面源代码如下:
<head>
<title> 无标题页 </title>
<script language= "javascript " type= "text/javascript ">
function SetPorgressBar(pos)
{
//设置进度条居中
var screenHeight = window[ "mainWindow "].offsetHeight;
var screenWidth = window[ "mainWindow "].offsetWidth;
ProgressBarSide.style.width = Math.round(screenWidth / 4);
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
