手机
当前位置:查字典教程网 >编程开发 >asp.net教程 >利用Asp.Net回调机制实现进度条
利用Asp.Net回调机制实现进度条
摘要:其效果如下:首先,在HTML文档中加入如下代码:Js部分加入如下Js代码:varidx=0;varprogressTimer;varprog...

其效果如下:

利用Asp.Net回调机制实现进度条1

首先,在HTML文档中加入如下代码:

<div>

<table>

<tr>

<td id="progress1">

</td>

<td id="progress2">

</td>

<td id="progress3">

</td>

<td id="progress4">

</td>

<td id="progress5">

</td>

<td id="progress6">

</td>

<td id="progress7">

</td>

<td id="progress8">

</td>

<td id="progress9">

</td>

<td id="progress10">

</td>

</tr>

</table>

<asp:Label ID="Label1" runat="server" ForeColor="Red" Text="0"></asp:Label>

</div>

<div>

<input id="btnRequest" type="button" value="请求" />

<input id="btnStop" type="button" value="停止" disabled="disabled" />

</div>

Js部分加入如下Js代码:

<script language="javascript" type="text/javascript">

var idx = 0;

var progressTimer;

var progressInterval = 1000;

function Request()

{

document.getElementById("btnStop").disabled = "";

document.getElementById("btnRequest").disabled = "disabled";

if(idx >= 10)

{

Clear();

return;

}

var arg = idx;

<%= ClientScript.GetCallbackEventReference(this, "arg", "GetMsgBack",null) %>;

idx++;

progressTimer = setTimeout('Request()',progressInterval);

}

function GetMsgBack(result)

{

document.getElementById('progress'+idx).style.backgroundColor = 'blue';

var status = Number(result) * 10;

document.getElementById("Label1").innerHTML = status + "%";

}

function Stop()

{

clearTimeout(progressTimer);

Clear();

}

function Clear()

{

idx = 0;

document.getElementById("btnStop").disabled = "disabled";

document.getElementById("btnRequest").disabled = "";

document.getElementById("Label1").innerHTML = "0";

for (var i = 1; i <= 10; i++)

document.getElementById('progress' + i).style.backgroundColor = 'transparent';

}

</script>

css样式文件中加入如下代码:

.statusTable

{

width:100px;

border:solid 1px #000000;

padding-bottom:0px;

margin-bottom:0px;

}

.statusTable td

{

height:20px;

}

Asp.Net服务端实现回调代码如下:

public partial class DigitStatus : System.Web.UI.Page, ICallbackEventHandler

{

private string AspEventArgs;

protected void Page_Load(object sender, EventArgs e)

{

}

public void RaiseCallbackEvent(string EventArgs)

{

AspEventArgs = EventArgs;

}

public string GetCallbackResult()

{

int i = Convert.ToInt32(AspEventArgs);

i++;

return i.ToString();

}

}

这样,一个简易的进度条就实现了,运行即可得到如页首处的效果。

【利用Asp.Net回调机制实现进度条】相关文章:

Asp.Net+XML操作基类(修改,删除,新增,创建)第1/2页

Asp.Net下通过切换CSS换皮肤

asp.net程序编译调试时偶尔出现访问被拒绝的错误的解决方法

ASP.NET技巧:教你制做Web实时进度条

ASP.NET实现用图片进度条显示投票结果

asp.net实现C#绘制太极图的方法

利用AJAX与数据岛实现无刷新绑定

Asp.Net URL重写的具体实现

asp.net刷新本页面的六种方法

用ASP.Net实现文件的在线压缩和解压缩

精品推荐
分类导航