`
yuanfen860913
  • 浏览: 115681 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
文章分类
社区版块
存档分类
最新评论

《Ajax开发精要》关于ajaxanywhere 教程四

Ajaxprototype应用服务器XMLUP 
阅读更多

3．AjaxAnywhere处理系统异常和HTTP请求异常

在Web应用程序中，系统异常和HTTP请求异常的处理一向是件比较头疼的事情。在Ajax应用程序中，这两个异常的处理会比传统的通信机制下相对棘手，惟一比较有效的方式就是在回调函数中判断HTTP请求的状态码并做相应的处理。如果异常未加以处理，用户根本不知道请求到底执行成功没有，页面上也不会有任何的反应，不像传统的通信机制下会显示“HTTP404错误”等类似的错误页面。

比较可喜的是，AjaxAnywhere提供了一种比较方便的异常处理方式。之前提到的，AjaxAnywhere将服务器返回的响应数据包装成一个XML文档，这个XML文档中同样也包含系统异常和HTTP请求异常的信息，它们被封装在exception元素中。在AjaxAnywhere默认的回调函数中可以看到，它将系统异常的信息交由this.handleException (type,detail)方法处理，而HTTP请求异常则交由this. handleHttpErrorCode(code)方法处理。默认的this.handle Exception(type,detail)方法将系统异常的细节显示在弹出窗口中，如图11-22所示，其代码如例程11-31所示。

例程11-31 AjaxAnywhere处理系统异常的方法

AjaxAnywhere.prototype.handleException = function(type, details) {

alert(details);

}

图11-22 AjaxAnywhere显示的系统异常信息

而默认的this.handleHttpErrorCode(code)则允许用户在一个新的页面中显示HTTP请求异常信息，如图11-23所示，其代码如例程11-32所示。

例程11-32 AjaxAnywhere处理HTTP请求异常的方法

AjaxAnywhere.prototype.handleHttpErrorCode = function(code) {

var details = confirm("AjaxAnywhere default error handler. XMLHttp Request HTTP Error code:" + code + " \n\n Would you like to view the response content in a new window?");

if (details) {

var win = window.open("", this.id + "_debug_window");

if (win != null) {

win.document.write("<html><body><xmp>" + this.req.response Text);

win.document.close();

win.focus();

} else {

alert("Please, disable your pop-up blocker for this site fir st.");

}

}

}

图11-23 AjaxAnywhere显示的HTTP请求异常

如果用户希望系统提供更加人性化的系统异常和HTTP异常处理机制，则可以重载这两个异常处理方法。AjaxAnywhere的demo示范包中有相应的案例可供参考，如图11-24和图11-25所示。

图11-24 重载后的系统异常处理

图11-25 重载后的HTTP请求异常处理

4．定制Ajax请求执行的提示信息

之前说过，在Ajax应用程序中，当Ajax请求正在执行的时候，应当在页面的适当位置提示用户请求正在执行。而Ajax请求执行完毕后，应当提示用户页面已经更新。AjaxAnywhere提供了默认的解决方案，在页面右上角显示一个“Loading…”的蓝色提示条，如图11-26所示，其实质是一个固定位置的DIV浮动层。

图11-26 AjaxAnywhere默认的Ajax请求执行提示信息

AjaxAnywhere对象的方法showLoadingMessage()和hideLoadingMessage()用于显示和隐藏这个提示信息，它们分别在Ajax请求发送前和回调函数中被调用，其代码如例程11-33所示。

例程11-33 AjaxAnywhere默认的Ajax请求执行提示信息方法

AjaxAnywhere.prototype.showLoadingMessage = function() {

var div = document.getElementById("AA_" + this.id + "_loading_ div");

if (div == null) {

div = document.createElement("DIV");

document.body.appendChild(div);

div.id = "AA_" + this.id + "_loading_div";

div.innerHTML = "&nbsp;Loading...";

div.style.position = "absolute";

div.style.border = "1 solid black";

div.style.color = "white";

div.style.backgroundColor = "blue";

div.style.width = "100px";

div.style.heigth = "50px";

div.style.fontFamily = "Arial, Helvetica, sans-serif";

div.style.fontWeight = "bold";

div.style.fontSize = "11px";

}

div.style.top = document.body.scrollTop + "px";

div.style.left = (document.body.offsetWidth - 100 - (document.all? 20:0)) + "px";

div.style.display = "";

}

AjaxAnywhere.prototype.hideLoadingMessage = function() {

var div = document.getElementById("AA_" + this.id + "_loading_ div");

if (div != null)

div.style.display = "none";

}

在必要的时候，可以在页面的适当位置重载上述两个方法，提供个性化的提示信息。例程11-34重载上述两个方法，将这个提示信息替换成轮显的图片，如图11-27所示。读者可以在AjaxAnywhere的demo演示包中找到这个案例。

例程11-34 重载后的Ajax请求提示信息方法

ajaxAnywhere.showLoadingMessage = function() {

var img = document.getElementById("myImg");

if (img == null) {

img = document.createElement("img");

document.body.appendChild(img);

img.id = "myImg";

img.src = "balls.gif";

img.style.position = "absolute";

img.style.border = "1 solid black";

img.style.top = 0;

img.style.left = document.body.offsetWidth - 170;

}

img.style.display = "";

}

AjaxAnywhere.prototype.hideLoadingMessage = function() {

var img = document.getElementById("myImg");

if (img != null)

img.style.display = "none";

}

图11-27 重载后的Ajax请求提示信息

分享到：
| 《Ajax开发精要》关于ajaxanywhere 教程三
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics