首页 » PHP和MySQL Web开发(原书第4版) » PHP和MySQL Web开发(原书第4版)全文在线阅读

《PHP和MySQL Web开发(原书第4版)》34.2 Ajax基础

关灯直达底部

到这里,已经了解了一个Ajax应用的可能组成部分,本节将使用这些组成部分创建一个可用的示例程序。请记住,使用Ajax的一个主要原因:创建一个能够响应用户动作的交互式网站,而这些响应并不需要刷新整个页面。

要实现此功能,Ajax应用需要包括一个能够处理发生在所请求的Web页面与负责生成该页面的Web服务器之间额外层。这个额外层通常就是指Ajax框架(也就是Ajax引擎)。该框架用来处理终端用户和Web服务器之间的请求,它可以不需要额外的动作就交流请求和响应,例如重新刷新页面,或者中断用户正在执行的动作(例如,滚动、点击或阅读一段文本)。

接下来的内容将介绍使用Ajax应用的不同组成部分创建一个流畅的用户体验。

34.2.1 XMLHTTPRequest对象

本章前面的内容已经介绍了HTTP请求和响应以及如何在一个Ajax应用中使用客户端编程。当连接Web服务器以及发送一个不需要重新载入整个原始页面的请求时,XMLHTTPReuqest对象是非常重要的,它也是JavaScript的特有对象。

注意 由于安全的原因,该对象只能调用同一域的URL;不能直接调用远程服务器。

XMLHTTPRequest对象也被看作是Ajax应用的“通道(guts)”,因为它是客户端请求和服务器端响应的“通道”。虽然接下来将介绍创建和使用XMLHTTPRequest对象的基础知识,请参阅http://www.w3.org/TR/XMLHttpRequest/获取详细信息。

XMLHTTPRequest对象具有一些属性,如表34-1所示。

XMLHTTPRequest对象具有一些方法,如表34-2所示。

在使用XMLHTTPRequest对象之前,必须创建该对象的实例。如下语句所示:

var request=new XMLHTTPRequest;

尽管以上代码可以在非IE的浏览器中工作,但是理想情况下,该代码应该可以支持所有用户。因此,如下所示的代码可以在所有浏览器下创建XMLHTTPRequest对象的实例:

function getXMLHTTPRequest{

var req=false;

try{

/*for Firefox*/

req=new XMLHttpRequest;

}catch(err){

try{

/*for some versions of IE*/

req=new ActiveXObject("Msxml2.XMLHTTP");

}catch(err){

try{

/*for some other versions of IE*/

req=new ActiveXObject("Microsoft.XMLHTTP");

}catch(err){

req=false;

}

}

}

return req;

}

如果将以上代码保存在一个文件ajax_functions.js中并且将其保存在Web服务器上,这样就创建了一个Ajax函数库。

当需要在Ajax应用中创建一个XMLHTTPRequest对象的实例,可以在代码中引入(include)包含所需函数的文件。

<script src="ajax_functions.js"type="text/javascript"></script>

接下来调用这个新对象以及继续编写应用的代码,如下所示:

<script type="text/javascript">

var myReq=getXMLHTTPRequest;

</script>

接下来的内容将介绍在Ajax函数文件中添加新的函数。