使用Ajax须留心两类错误。它们的差别源于视角的不同。

第一类错误是从XMLHttpRequest对象的角度看到的问题：某些因素阻止了请求发送到server，比如DNS无法解析主机名，连接请求被拒绝。或者URL无效。

第二类错误是从应用程序的角度看到的问题：它们发生于请求成功发送至server，server接受请求。进行处理并生成响应，但该对应并不指向你期望的内容时。比如：假设你请求的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>

javascript之处理Ajax错误的更多相关文章

  1. 【温故而知新-Javascript】使用 Ajax

    Ajax 是现代Web 应用程序开发的一项关键工具.它让你能向服务器异步发送和接收数据,然后用 Javascript 解析. Ajax 是 Asynchronous JavaScript and XM ...

  2. javascript进阶之AJAX

    AJAX 一 AJAX预备知识:json进阶 1.1 什么是JSON? JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.JSON是用字符串来表示Javas ...

  3. jQuery之ajax错误调试分析

    jQuery中把ajax封装得非常好.但是日常开发中,我偶尔还是会遇到ajax报错.这里简单分析一下ajax报错 一般的jQuery用法如下,ajax通过post方式提交"汤姆和老鼠&quo ...

  4. Ajax错误 “SCRIPT7002: XMLHttpRequest: 网络错误 0x2ef3, 由于出现错误 00002ef3 而导致此项操作无法完成” 的归纳总结

    最近在做Asp.net项目的时候,用Ajax访问服务器数据有时候老是莫名其妙的报错:SCRIPT7002: XMLHttpRequest: 网络错误 0x2ef3, 由于出现错误 00002ef3 而 ...

  5. 《JAVASCRIPT高级程序设计》错误处理与调试

    一.错误处理 错误处理在程序设计中的重要性是毋庸置疑的,任何有影响力的web应用程序都需要一套完善的错误处理机制.良好的错误机制可以让用户得到提醒,知道发生了什么事. 1.try-catch语句 tr ...

  6. ajax错误类型大全

    https://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html ajax错误类型大全

  7. 用javascript写原生ajax(笔记)

    AJAX  的全名叫做  Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并 ...

  8. javascript实现原生ajax

    自从javascript有了各种框架之后,比如jquery,使用ajax已经变的相当简单了.但有时候为了追求简洁,可能项目中不需要加载jquery这种庞大的js插件.但又要使用到ajax这种功能该如何 ...

  9. $.ajax 错误信息

    $.extend({ getHtml:function(url,callback){ $.ajax({ dataType:"html", url:url, timeout:1500 ...

随机推荐

  1. Oracle Database 11g Express Edition 使用小结(windows)

    如何启动oraclewindows系统服务中有一个服务叫:[OracleService[SID]]SID是你安装oracle xe时候的实例名,如果你没有改默认的是[XE], OracleServic ...

  2. Ioc注入方式写dubbo client（非set beans）

    @Autowired注解的方式注解 Spring框架中进行注入式,使用@Autowired. @Autowired可以对成员变量.方法和构造函数进行标注,来完成自动装配的工作,这里必须明确:@Auto ...

  3. 让IE6IE7IE8支持CSS3属性的8种方法介绍

    我们都知道,IE浏览器暂不支持CSS3的一些属性.国外的工程师们,不安于此现状,他们总是尽量使用一些手段使IE浏览器也能支持CSS3属性,我觉得这些都是很有意义,很有价值的工作,可以推动整个技术领域的 ...

  4. win8 VS控件信息

    <TextBlock x:Name="button_1" HorizontalAlignment="Center"  TextWrapping=" ...

  5. STL六大组件之——迭代器这个东西

    迭代器:除了在其它语言中司空见惯的下标法访问容器元素之外,C++语言提供了一种全新的方法——迭代器(iterator)来访问容器的元素.迭代器其实类似于引用,指向容器中某一元素.换个方式来说,容器就是 ...

  6. log4net--帮助程序员将日志信息输出到各种目标（控制台、文件、数据库等）的工具

    1. log4net库是Apache log4j框架在Microsoft .NET平台的实现,是一个帮助程序员将日志信息输出到各种目标(控制台.文件.数据库等)的工具. 2. Log4net的结构如下 ...

  7. 30+简约时尚的Macbook贴花

    当Macbooks Pro电脑在他们的设计之下仍然漂亮.独一无二时,我想说,他们已经成为相当的主流了.有时候如果你回忆过去的很美好的日子,当人们偷偷欣赏你的技术装备 的时候,大概是为你的外表增加亮点的 ...

  8. CentOS 5.5 快速安装MariaDB-5.5.35

    被网上各种教程坑的不轻T,T,5.5下不升级yum的情况下想快速安装还真有点费劲 至于源码编译安装坑貌似更多 而且在小内存的VPS上编译实在费力 下载地址 http://yum.mariadb.org ...

  9. 消息队列与RabbitMQ

    1 什么是消息队列 消息指进程或应用间通信的数据:队列是保存数据的结构:消息队列是指进程或应用间通信时,保存消息的容器.消息队列独特的机制和结构保证了消息发送者和接收者之间良好的异步通信. 2 为什么 ...

  10. [LeetCode] #167# Two Sum II : 数组/二分查找/双指针

    一. 题目 1. Two Sum II Given an array of integers that is already sorted in ascending order, find two n ...