使用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. Independence独立

    Independence refers to the degree to which each test case stands alone. That is, does the success or ...

  2. jQuery文本框(input textare)事件绑定方法教程

    jquery 的事件绑定已经用on替换了原来的bind,接下来为大家分享下bind的使用方法及input textare事件.目前1.7以上,jquery?的事件绑定已经用on替换了原来的bind,接 ...

  3. ID@Xbox计划宣传片 XboxOne喜迎大波小游戏（转）

    微软Xbox One游戏不够多?别担心,微软的ID@Xbox计划将带来一大波独立游戏!微软在今天正式公布了即将登陆旗下的Xbox One主机平台的独立游戏阵容,数量多达32款,官方的宣传片也已放出,感 ...

  4. CentOS下安装gns3

    1.安装支持环境 sudo yum intall PyQt4 telnet 2.安装抓包用的wireshark sudo yum install wireshark wireshark-gnome 3 ...

  5. python 抽象类、抽象方法的实现

    由于python 没有抽象类.接口的概念,所以要实现这种功能得abc.py 这个类库,具体方式如下 from abc import ABCMeta, abstractmethod #抽象类 class ...

  6. arm tiny6410双网卡桥接问题

    这几天做实验,想用arm tiny6410板子做个mesh网络节点.该板子本身自带一个lan网卡,我自己配了一个tp-link的usb无线网卡.其中wlan网卡工作在adhoc模式下,作为mesh骨干 ...

  7. IOS自动布局

    参考资料 https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/AutolayoutPG/Vi ...

  8. SQL Server 系统视图

    SQL Server系统视图非常的多,因此不可能一个一个地写,我最近一直在想,对于数据库的系统视图应该如何学,但是看了一下目录之后,我呆了,我觉得每个写一次,可能都要花费1个星期的时间,如果对每一个返 ...

  9. 第三百三十天 how can I 坚持

    今天是姥姥二周年,不是忘了,是根本就没不知道,没放在心上,正月十九,记下了,人这一辈子. 搞不懂,搞不懂那签. 锥地求泉,先难后易,顺其自然,偶遇知己,携手同行,是签文的关键,我逐个解释给你听.锥地求 ...

  10. 第二百一十七天 how can I 坚持

    JavaScript  document.getElementByName()获取数组,for循环,搞了一天,好笨. 明天要下雪了,好冷. 双十一,天猫搞的挺特别啊,晚上抢了个小米红包,不知道买啥,哎 ...