6.4使用JavaScript程序代码来显示与隐藏UpdateProgress控件

<asp:UpdateProgress ID="UpdateProgress1" runat="server"
AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<table width="315" style="background-color: #ffffcc">
<tr valign="middle">
<td style="width: 26px">
<img src="Images/Loading1.gif" />
</td>
<td style="width: 279px">
正在取得章节目录中...请稍后
</td>
</tr>
<tr valign="middle">
<td style="width: 26px; text-align: center;">
<img src="Images/Loading5.gif" /> 
</td>
<td style="width: 279px">
<input id="btnCancel" type="button" value="取消查询"
onclick="CancelAsyncPostBack()" />  
</td>
</tr>
</table>
</ProgressTemplate>
</asp:UpdateProgress>

<script language="javascript" type="text/javascript">
// 取得 PageRequestManager 类的实例。
var prm = Sys.WebForms.PageRequestManager.getInstance(); 
// 当按下"取消查询"按钮就会执行这个 JavaScript 函数。
function CancelAsyncPostBack()
{
if (prm.get_isInAsyncPostBack())
{
// 调用 PageRequestManager 实例的 abortPostBack 方法来取消当前执行中的异步回送。
prm.abortPostBack();
}
}

// 设定当引发 initializeRequest 事件时就执行事件处理函数 InitializeRequest。
prm.add_initializeRequest(InitializeRequest);

// 设定当引发 endRequest 事件时就执行事件处理函数 EndRequest。
prm.add_endRequest(EndRequest);

// 声明一个变量来存放引发异步回送的控件的 id 。
var postBackElement;

function InitializeRequest(sender, args)
{
if (prm.get_isInAsyncPostBack())
{
args.set_cancel(true);
}

postBackElement = args.get_postBackElement();

// 如果是"取得章节目录"按钮引发异步回送，则将名称为 UpdateProgress1
// 的 UpdateProgress 控件显示出来。
if (postBackElement.id = 'btnGetBookDetail')
{
$get('UpdateProgress1').style.display = 'block'; 
}
}

function EndRequest(sender, args)
{
// 如果是"取得章节目录"按钮引发异步回送，则将名称为 UpdateProgress1
// 的 UpdateProgress 控件隐藏起来。
if (postBackElement.id = 'btnGetBookDetail')
{
$get('UpdateProgress1').style.display = 'none';
}
}
</script>