asp.net显示进度提示功能.

本文介绍如何在ASP.NET应用程序中使用JavaScript实现一个加载进度条。通过在服务器控件上绑定客户端点击事件来触发进度条显示与隐藏,同时提供了一个完整的JavaScript脚本示例,该脚本兼容IE和其他现代浏览器。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 在服务器控件绑定一个js方法,如:

<asp:button onClentClick="showLoading()">

javascript脚本可以放到一个Loading.js文件中.代码如下:

  1. //显示进度条
  2. var isIE=!!document.all;
  3. var imgGlobalUrl = 'http://localhost/';
  4. var loadHTML = '<table border="0" cellspacing="0" cellpadding="0"><tr><td width="8" align="right" background="'+imgGlobalUrl+'Images/waiting_l.gif"> </td><td background="'+imgGlobalUrl+'Images/waiting_m.gif" style="PADDING-RIGHT:0px;PADDING-LEFT:5px;FONT-WEIGHT:bold;FONT-SIZE:14px;PADDING-BOTTOM:0px;COLOR:#0f5594;PADDING-TOP:0px"><IMG SRC="'+imgGlobalUrl+'Images/loading.gif" border="0"></td><td background="'+imgGlobalUrl+'Images/waiting_m.gif" style="PADDING-RIGHT:0px;PADDING-LEFT:5px;FONT-WEIGHT:bold;FONT-SIZE:14px;PADDING-BOTTOM:0px;COLOR:#0f5594;PADDING-TOP:0px">正在处理,请稍候。。。</td><td width="8" height="40" background="'+imgGlobalUrl+'Images/waiting_r2.gif"> </td></tr></table>';
  5. var loadingDiv=document.createElement("div");
  6. loadingDiv.innerHTML=loadHTML;
  7. loadingDiv.style.position="absolute";
  8. loadingDiv.style.display="none";
  9. loadingDiv.style.zIndex = 9999;
  10. var loadingTimeout
  11. var funInsertLoadingDiv = function(){
  12.         document.body.insertBefore(loadingDiv,null);
  13. };
  14. if(isIE)
  15.     window.attachEvent("onload",funInsertLoadingDiv);
  16. else
  17.     window.addEventListener('load', funInsertLoadingDiv, false);
  18. function showLoading()
  19. {
  20.     window.clearTimeout(loadingTimeout);
  21.     with(loadingDiv.style)
  22.     {
  23.         display="";
  24.         top=document.body.scrollTop+200;
  25.         if (loadingDiv.offsetWidth)
  26.             left=document.body.clientWidth/2 - loadingDiv.offsetWidth/2;
  27.           else
  28.             left=document.body.clientWidth/2 - 115;
  29.     }
  30. }
  31. function hideLoading()
  32. {
  33.     loadingDiv.style.display="none";
  34. }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值