简单的 new
首先需要创建一个新变量并赋给它一个 XMLHttpRequest 对象实例。这在 JavaScript 中很简单,只要对该对象名使用 new 关键字即可,如 清单 1 所示。
清单 1. 创建新的 XMLHttpRequest 对象
代码如下 | 复制代码 |
<script language="javascript" type="text/javascript"> var request = new XMLHttpRequest(); </script> |
不难吧?记住,JavaScript 不要求指定变量类型,因此不需要像 清单 2 那样做(在 Java 语言中可能需要这样)。
清单 2. 创建 XMLHttpRequest 的 Java 伪代码
代码如下 | 复制代码 |
XMLHttpRequest request = new XMLHttpRequest(); |
因此在 JavaScript 中用 var 创建一个变量,给它一个名字(如 “request”),然后赋给它一个新的 XMLHttpRequest 实例。此后就可以在函数中使用该对象了。
错误处理
在实际上各种事情都可能出错,而上面的代码没有提供任何错误处理。较好的办法是创建该对象,并在出现问题时优雅地退出。比如,任何较早的浏览器(不论您是否相信,仍然有人在使用老版本的 Netscape Navigator)都不支持 XMLHttpRequest,您需要让这些用户知道有些地方出了问题。清单 3 说明如何创建该对象,以便在出现问题的时候发出 JavaScript 警告。
清单 3. 创建具有错误处理能力的 XMLHttpRequest
代码如下 | 复制代码 |
<script language="javascript" type="text/javascript"> var request = false; try { request = new XMLHttpRequest(); } catch (failed) { request = false; } if (!request) alert("Error initializing XMLHttpRequest!"); </script> |
一定要理解这些步骤:
创建一个新变量 request 并赋值 false。后面将使用 false 作为判定条件,它表示还没有创建 XMLHttpRequest 对象。
增加 try/catch 块:
尝试创建 XMLHttpRequest 对象。
如果失败(catch (failed))则保证 request 的值仍然为 false。
检查 request 是否仍为 false(如果一切正常就不会是 false)。
如果出现问题(request 是 false)则使用 JavaScript 警告通知用户出现了问题。
代码非常简单,对大多数 JavaScript 和 Web 开发人员来说,真正理解它要比读写代码花更长的时间。现在已经得到了一段带有错误检查的 XMLHttpRequest 对象创建代码,还可以告诉您哪儿出了问题。
以下是xmlHttp的coding:
代码如下 | 复制代码 |
var xmlHttp; function createXMLHttpRequest(){ //Mozilla 浏览器(将XMLHttpRequest对象作为本地浏览器对象来创建) if(window.XMLHttpRequest){ //Mozilla 浏览器 xmlHttp = new XMLHttpRequest(); }else if(window.ActiveXObject) { //IE浏览器 //IE浏览器(将XMLHttpRequest对象作为ActiveX对象来创建) try{ xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); }catch(e){ try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){} } } if(xmlHttp == null){ alert("不能创建XMLHttpRequest对象"); return false; } } //用于发出异步请求的方法 function sendAsynchronRequest(url,parameter,callback){ createXMLHttpRequest(); if(parameter == null){ //设置一个事件处理器,当XMLHttp状态发生变化,就会出发该事件处理器,由他调用 //callback指定的javascript函数 xmlHttp.onreadystatechange = callback; //设置对拂去其调用的参数(提交的方式,请求的的url,请求的类型(异步请求)) xmlHttp.open("GET",url,true);//true表示发出一个异步的请求。 xmlHttp.send(null); }else{ xmlHttp.onreadystatechange = callback; xmlHttp.open("POST",url,true); xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;"); xmlHttp.send(parameter); } } //以上代码是通用的方法,接下来是调用以上的方法 function loadPros(title,count,pid,cid,level){ // 调用异步请求方法 url = "。。。。。。。。"; sendAsynchronRequest(url,null,loadCallBack); } // 指定回调方法 function loadCallBack(){ try { if (xmlHttp.readyState == 4) { if (xmlHttp.status == 200) { if(xmlHttp.responseText != null && xmlHttp.responseText != ""){ var divProid = document.getElementById('videolist'); divProid.innerHTML = xmlHttp.responseText; for(i=0;i<len;i++) { var video_url = document.getElementById("videolist"+i+"").href; if(video_url != undefined && video_url != null && video_url != ""){ window.location.href = video_url; } } } } } if (xmlHttp.readyState == 1) { //alert("正在加载连接对象......"); } if (xmlHttp.readyState == 2) { //alert("连接对象加载完毕。"); } if (xmlHttp.readyState == 3) { //alert("数据获取中......"); } } catch (e) { //alert(e); } } |
一个兼容性比较好的ajax代码
代码如下 | 复制代码 |
var http_request = false; //ajax 对象 function changepage(url,idname) { if(url.indexOf("?")>-1) url=url+ "&now="+(new Date()).getTime(); else url=url+ "?now="+(new Date()).getTime(); http_request = false; if (window.XMLHttpRequest) { // Mozilla, Safari,... http_request = new XMLHttpRequest(); if (http_request.overrideMimeType) { http_request.overrideMimeType('text/xml'); } } else if (window.ActiveXObject) { // IE try { http_request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { http_request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {} } } if (!http_request) { function LoadContent(idname) |