javascript也玩pageLoad

    前几天跟皱键讨论ASP.NET AJAX的时候,他说在ASP.NET AJAX 下也有pageLoad事件,因为对这个pageLoad没有什么编程经验,所以也就不觉得有什么。不过昨天晚上的一个功能让我感觉到了这个pageLoad功能上的令人感叹之处。
    众所周知,ScriptManager是ASP.NET的的一个核心控件,如果一个页面用到了AJAX Extentions控件的话,那么该页面上必须有ScriptManager控件。当页面上出现了异常时,它不会再像普通的2.0的页面那样显示出红黄页(在没有进行任何处理的情况下),而是以alert的方式弹出对话框,告知用户出现了异常。这种弹出对话框的方式一般来说应该也是可以令人接受的,不过,若想得到更高级的用户体验的话,可能就需要我们自己手动再写一些代码了。比如说出现像网易邮箱中当你要清空垃圾邮件箱时的对话框效果,需要我们自己手动再写一些代码来实现。
   在html页面上放置一个隐藏的层,该层用来显示我们的异常信息。
  
 1 None.gif   < div id = " errorMessage "  style = " LEFT: -30px; POSITION: relative; TOP: -257px; visibility:hidden " >
 2 None.gif  2                  < div class = " title " >
 3 None.gif  3                     操作提示
 4 None.gif  4                  </ div >
 5 None.gif  5                  < div class = " alertTxt " >
 6 None.gif  6                      < span id = " errorMessageLabel "  runat = " server " ></ span >
 7 None.gif  7                  </ div >
 8 None.gif  8                  < div >
 9 None.gif  9                      < input id = " Button1 "  class = " btn "  type = " button "  value = " OK "  onclick = " javascript :onOK(); "   />
10 None.gif 10                  </ div >
11 None.gif 11              </ div >
12 None.gif 12          </ center >

 然后,我们就可以利用此层,以及ASP.NET AJAX框架下的JS的pageLoad事件中写关于异常处理的事件了。

  
 1 None.gif
 2 None.gif < script language = " javascript "  type = " text/javascript " >
 3 None.gif         function  pageLoad()
 4 ExpandedBlockStart.gifContractedBlock.gif         dot.gif {
 5InBlock.gif           Sys.WebForms.PageRequestManager.getInstance().add_endRequest(onEndRequest);
 6ExpandedBlockEnd.gif        }

 7 None.gif         function  onEndRequest(sender, e) 
 8 ExpandedBlockStart.gifContractedBlock.gif         dot.gif {
 9InBlock.gif            // 异常发生时将对话框显示给用户
10InBlock.gif            if(e.get_error())
11ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
12InBlock.gif                // 显示自定义对话框
13InBlock.gif                $get("errorMessage").style.display = "block";
15InBlock.gif                $get("errorMessageLabel").innerHTML ="出错了,请重试!<br>" +  e.get_error().description;
16InBlock.gif                // 通知PageRequestManager异常已经处理过
17InBlock.gif                e.set_errorHandled(true);
18ExpandedSubBlockEnd.gif            }

19ExpandedBlockEnd.gif        }

20 None.gif         function  onOK()
21 ExpandedBlockStart.gifContractedBlock.gif         dot.gif {
22InBlock.gif            $get("errorMessage").style.display = "none";
23ExpandedBlockEnd.gif        }

24 None.gif </ script >

  通过以上简单的代码,一个有着良好的用户体验的对话框就完成了。细细想想,这或许可以做为整个网站上所有页面上的公有js文件,将它嵌套到页面中,则每个页面的异常都会以一个良好体验的对话框显示给用户。帅!
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值