为Ajax的HTTP Request设置时间限制(Timeout)

假如XMLHttpRequest对象并没有成功呢？我们是不是应该也对这种情况加以处理，以便于让浏览者明白，哦，现在程序出问题了，而不是让浏览者一直的去等待数据的呈现，我想这样就能使得用户体验更好，虽然我们的请求因为种种原因失败，但是我们要能显示的在失败的第一时间告诉了浏览者，那么浏览者就不会一直再去等待数据的显示，或许他可以进行其他的操作，或者重新请求，这样岂不更人性化些~那么说了这么多，我们应该如何实现呢~其实这里就要用到一个setTimeout这个函数了，当我们成功发出请求，我们能使用XMLHttpRequest对象去捕获抓取准备状态和HTTP响应状态，那么我们就要在XMLHttpRequest对象发出请求后立即设定一个setTimeout函数去处理超时或者失败状况，这个函数默认有两个参数，一个为处理函数，一个为时间间隔毫秒数。下面重点看我们的代码：

<script type=”text/javascript”>

 

       function getXMLHttpRequest()

       {

            var xhr = false;

            if ( window.XMLHttpRequest )

            {

                xhr = new XMLHttpRequest();

                if ( xhr.overrideMimeType )

                {

                    xhr.overrideMimeType(”text/xml”);

                }

            }else if ( window.ActiveXObject )

            {

                try{

                        xhr = new ActiveXObject(”Msxml2.XMLHTTP”);

                    }catch(e)
                    {

                        try{

                                xhr = new ActiceXObject(”Microsoft.XMLHTTP”);

                            }catch(e)
                            {

                                xhr = false;

                            }

                    }

            }

 

            return xhr;

       }

 

        window.onload = function()

        {

            var _x = getXMLHttpRequest(); //获得XMLHttpRequest对象

            if ( !_x ) return false;

            _x.open(”get”, http://www.baidu.com,true);

            _x.onreadystatechange = function()

            {

                if ( _x.readyState == 4 && _x.status == 200 )

                {

                    clearTimeout(clearTO); //如果准备状态成功，并且HTTP状态码正确则清除setTimeout

                    alert(”Success”);

                }    

            };

            var cleaeTO = setTimeout(function()  /*重点，在请求发布后开始设置setTimeout，如果请求状态不成功也就是readyState != 4 那么setTimeout将会在5秒后运行，并弹出信息提示，要是请求成功，将会清除该setTimeout*/

            {

                _x.abort(); //终止XMLHttpRequest对象

                alert(”系统异常，请您刷新页面或稍后再试….”);

            },50000);

            _x.send(null);

        };

</script>