首页 | 新闻 | 新品 | 文库 | 方案 | 视频 | 下载 | 商城 | 开发板 | 数据中心 | 座谈新版 | 培训 | 工具 | 博客 | 论坛 | 百科 | GEC | 活动 | 主题月 | 电子展
返回列表 回复 发帖

用 PHP 构建基于 Ajax 的 Web 站点(1)

用 PHP 构建基于 Ajax 的 Web 站点(1)

PHP 已经流行很多年了。PHP 通常作为服务器端脚本语言,用来快速开发基于 Web 的应用程序,而且效果很不错。实际上,一些最流行的 Web 项目(比如 PHP-Nuke、osCommerce 和 Joomla)都是用 PHP 开发的,它们至今仍然很兴旺。
Ajax 也已经出现了一阵子了,但是直到最近使用 Ajax 技术开发的 Web 站点才开始大量增加。Ajax 技术使 Web 站点或 Web 应用程序能够自动地与服务器通信,而不需要刷新整个页面。从本质上说,Ajax 的异步特性使客户机浏览器能够向服务器发送请求或调用服务器端的方法。在客户端,可以使用 JavaScript 代码处理服务器返回的结果,然后可以把任何输出合并到现有的前端 HTML 视图中,而不需要刷新页面。在使用 Ajax 时,实际上并不使用新的编程语言。实际上,只需组合使用现有技术。
Ajax 资源中心请访问 ,这是有关 Ajax 编程模型信息的一站式中心,包括很多文档、教程、论坛、blog、wiki 和新闻。任何 Ajax 的新信息都能在这里找到。

PHP 和 Ajax 的组合提供一个强大的平台,可以用来创建具备健壮的特性的 Web 站点或 Web 应用程序。本文讨论 PHP 和 Ajax 的一些用途,研究如何在自己的 Web 应用程序中使用它们。在阅读本文之前,您应该充分理解 HTML 和 JavaScript 编程。您还应该熟悉 PHP 脚本编程语言,虽然也可以使用大多数其他脚本语言。
与服务器通信在 Ajax 中客户机 / 服务器通信的关键是使用 JavaScript XMLHttpRequest对象。大多数浏览器都支持这个对象,包括 Windows®Internet Explorer 5.0 和更高版本、Safari 1.2、Mozilla Firefox、Opera 8 和更高版本以及 Netscape 7。为了解释传统客户机 / 服务器通信和基于 Ajax 的客户机 / 服务器通信之间的差异,下面举一个例子。按照传统方式,为了让客户机浏览器向服务器发送需要处理或存储在数据库中的内容,常常使用 POST方法把客户端上输入控件收集的内容发送到服务器。服务器使用 PHP(或其他脚本语言)处理这些内容,使用数据库读取或存储数据,最后返回嵌入在 HTML 代码中的结果。然后,浏览器处理 HTML 并向最终用户显示一个新页面。图 1 描述这个场景。
图 1. 提交数据并接收结果的传统过程通过使用 Ajax,同样的过程在前端需要的时间更少。其基本思想是让用户感觉不必等待页面更新。实际上,通过使用 Ajax,可以用一个 HTML 页面构成整个 Web 应用程序,但是不建议这么做。按照传统方式,如果希望向服务器提交一个表单,就要设置表单的动作并把动作类型指定为 POST。在使用 Ajax 时,实际上并不向服务器直接提交表单,而是调用一个 JavaScript 函数。这个函数从表单收集数据并执行检验,然后使用 XMLHttpRequest把数据发送给一个服务器端函数。当结果返回客户机时,客户机处理结果并更新需要更新的页面部分。在这种情况下,页面 并不全部地刷新。因此,处理 HTML 所花费的时间更少,性能会更好。图 2 说明了使用 Ajax 更新页面与刷新整个页面之间的细微差别。
图 2. 提交数据并接收结果的 Ajax 过程现在看看通过 JavaScript 代码与服务器进行通信所需的步骤。首先,定义表单的外观,见清单 1。
清单 1. HTML 表单
1
2
3
4
5
6
7
8
9
10
11
<body>
My First Ajax Page

<form name="myForm">
Press button to view server time:
<input type="button" value="Update"
onClick="ajaxFunction();" />
Server Time Is: <input type="text" name="time" />
</form>

</body>




这个表单产生图 3 所示的输出。
图 3. HTML 表单的输出这个表单没有做任何真正有用的事,但是它帮助您了解在自己的代码中的什么地方集成 Ajax。
请注意按钮上指定的 onClick事件。这个事件调用一个名为 ajaxFunction的 JavaScript 函数。这里就是 Ajax 中比较有趣的地方。在这个方法中,要执行几个步骤,本节会逐一解释这些步骤:
  • 创建 XMLHttpRequest对象的实例。
  • 连接要调用的服务器端服务。
  • 告诉 Ajax 在服务器端代码执行完成并返回结果时应该调用哪个方法。
  • 发送请求。
  • 异步地响应。
返回列表