标签：htm5 前端 网页设计 javascript
使用Ajax须留心两类错误。它们的区别源于视角的不同。
第一类错误是从XMLHttpRequest对象的角度看到的问题：某些因素阻止了请求发送到服务器，例如DNS无法解析主机名，连接请求被拒绝，或者URL无效。
第二类错误是从应用程序的角度看到的问题：它们发生于请求成功发送至服务器，服务器接受请求，进行处理并生成响应，但该相应并不指向你期望的内容时。例如：如果你请求的URL不存在，这类问题就会发生。
有三种方式可以处理这些错误，如下代码所示：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>上海远地资产管理有限公司</title>
<meta name="author" content="jason"/>
<meta name="description" content="上海远地资产管理有限公司（简称：远地资产），是一家专业的互联网金融服务平台."/>
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>
</head>
<body>
<div>
<button>Apples</button>
<button>Cherries</button>
<button>Bananas</button>
<button>Cucumber</button>
<button id="badhost">Bad Host</button>
<button id="badurl">Bad URL</button>
</div>
<div id="target">
加载内容
</div>
<div id="errormsg"></div>
<div id="statusmsg"></div>
<script>
var buttons=document.getElementsByTagName("button");
for(var i=0;i<buttons.length;i++){
buttons[i].onclick=handleButtonPress;
}
var httpRequest;
function handleButtonPress(e){
clearMessages();
httpRequest=new XMLHttpRequest();
httpRequest.onreadystatechange=handleResponse;
httpRequest.onerror=handleError;
try{
switch (e.target.id){
//处理请求错误：请求已生成，但主机名不能被DNS解析
case "badhost":
httpRequest.open("GET","http://a.nodomain/doc.html");
break;
//处理设置错误：向XMLHttpRequest对象传递了错误的数据，比如格式不正确的URL
case "badurl":
httpRequest.open("GET","http://");
break;
//处理应用程序错误：请求已成功完成，但当你请求某个不存在的文档时，会获得404的状态码；
default:
httpRequest.open("GET", e.target.innerHTML+".html");
break;
}
httpRequest.send();
}catch(error){
displayErrorMsg("try/catch",error.message);
}
}
function handleError(e){
displayErrorMsg("Error event",httpRequest.status+httpRequest.statusText);
}
function handleResponse(){
if(httpRequest.readyState==4){
var target=document.getElementById("target");
if(httpRequest.status==200){
target.innerHTML=httpRequest.responseText;
}else{
document.getElementById("statusmsg").innerHTML="Status:"+httpRequest.status+" >>"+httpRequest.statusText;
}
}
}
function displayErrorMsg(src,msg){
document.getElementById("errormsg").innerHTML=src+": "+msg;
}
function clearMessages(){
document.getElementById("errormsg").innerHTML="";
document.getElementById("statusmsg").innerHTML="";
}
</script>
</body>
</html>版权声明：本文为博主原创文章，未经博主允许不得转载。
标签：htm5 前端 网页设计 javascript
原文地址：http://blog.csdn.net/bboyjoe/article/details/47024049
