[转] 通过 PHP 和 Sajax 使用 Ajax(三)

转载 2006年05月31日 01:05:00

 

通过 PHP 和 Sajax 使用 Ajax (三)

简单 Ajax 工具包如何把服务器端 PHP 与 JavaScript 集成

Tyler Anderson , 自由作者, Stexar 公司
2006 年 05 月 11 日

与 Sajax 集成

这一节将介绍什么是 Sajax,它如何模拟异步 JavaScript,以及当前的 Ajax 应用程序怎样转化成 Sajax 应用程序。

什么是 Sajax?

简单 Ajax 工具包(Sajax)是同步的异步 JavaScript 和 XML。同步的原因是,当前应用程序中使用的 XML HTTP 对象的细节,通过使用 Sajax.php 库文件而被抽象出去。这使开发 Ajax 应用程序变得更加容易,因为编程出错的机会降低了。链接也变得更加容易,因为它们将只包含函数调用。基本上,Sajax 是一种制作 Ajax 应用程序的模块化方式,通过预定的、动态的函数调用,使得应用程序的开发过程更加平滑。

 

模拟异步 JavaScript

在这一节中,要使用 Sajax 的几个方面来模拟 Ajax。其中一个是 sajax_init,它初始化 Sajax 库。接下来是 sajax_export 函数,要调用它来通知 Sajax 有一个“面板”内容区,稍后会为它创建对应的 JavaScript 函数。针对应用程序需要的动态内容区的多少,可以根据需要为每个动态内容区调用 sajax_export,次数不限。

下一个要使用的函数是 sajax_handle_client_request。这个函数初始化 Sajax 的数据结构,让应用程序准备好处理客户请求。还要设置 $sajax_remote_uri。这是应用程序发送客户请求的目标 URL,与 Ajax 应用程序的链接中嵌入的 URL 类似。

最后,需要用 sajax_show_javascript 函数把 Sajax JavaScript 函数包含在 JavaScript 中。

 

幕后发生了什么?

现在会发生什么?在幕后,Sajax 起的作用实际与 Ajax 相同。但是,Sajax 会替您设置 XML HTTP 对象,从而简化开发工作。它允许应用程序使用 JavaScript 函数用一种模块化的方式拥有多个内容区。Sajax 包使得 Ajax 开发更有效率,同时具有同样的幕后功能。


初始化 Sajax

现在开始 Sajax 应用程序。请拷贝 ajax-app.php 文件并把拷贝改名为 sajax-app.php。把文件放在与 ajax-app.php 文件相同的目录中。添加以下代码到文件开始:


清单 13. 初始化 Sajax


					
<?
require("Sajax.php");

$sajax_remote_uri =
    "http://localhost.localdomain/ajax-sajax/panels-sajax.php";
sajax_init();
sajax_export("panels");
sajax_handle_client_request();
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
...

首先,需要设置远程 URL。然后需要初始化 Sajax 并导出“panels”。这对 Sajax 进行初始化,允许稍后创建的 JavaScript 函数去处理与“panels”内容相关的请求。


修改链接

链接现在需要包含函数,以便把面板 ID 传递给对应的 JavaScript 函数。


清单 14. 应用程序中的面板链接


					
<?php require('content/header.html'); ?>

<span onclick="getPanel(0)">Managing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(1)" >Adding content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(2)" >Saving new content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(3)" >Editing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(4)" >Saving edited content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(5)" >Avoid adding duplicates</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(6)" >Avoid editing a page
                            that doesn't exist</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(7)" >Deleting content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(8)" >Serving a page</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(9)">Pulling it together:
                            The CMS control page</span>

<?php require('content/pre-content.html'); ?>
...

点击链接会调用一个不同的 JavaScript 函数,接下来会添加这个函数。

 

替换 JavaScript

在继续之前,请从 Ajax 应用程序删除 JavaScrip。需要添加新的函数,这些新函数和 XML HTTP 对象无关。添加以下代码代替当前的 JavaScript 函数:


清单 15. 新的 JavaScript 函数


					
...
<script type="text/javascript">
    <?php sajax_show_javascript(); ?>

    function getPanel_cb(content) {
        document.getElementById('content').innerHTML = content;
    }

    function getPanel(panel_id){
        x_panels(panel_id, getPanel_cb);
    }
</script>
...

第一行调用 sajax_show_javascript,它导入 Sajax 需要的 JavaScript 函数和其他要添加的 getPanel 函数。这些添加的 JavaScript 函数把 Sajax 应用程序的核心带到浏览器,因为浏览器首次装入页面后,PHP 就没有作用了。

 

返回 Sajax 内容

现在需要修改 panels-ajax.php 文件以便适应 Sajax。拷贝并重命名 panels-ajax.php 文件为 panels-sajax.php 并把它放在与其他文件相同的目录下。修改它,如清单 16 所示。


清单 16. panels-sajax.php 的修改


					
<?php

if(

 

通过 PHP 和 Sajax 使用 Ajax (三)

简单 Ajax 工具包如何把服务器端 PHP 与 JavaScript 集成

Tyler Anderson , 自由作者, Stexar 公司
2006 年 05 月 11 日

与 Sajax 集成

这一节将介绍什么是 Sajax,它如何模拟异步 JavaScript,以及当前的 Ajax 应用程序怎样转化成 Sajax 应用程序。

什么是 Sajax?

简单 Ajax 工具包(Sajax)是同步的异步 JavaScript 和 XML。同步的原因是,当前应用程序中使用的 XML HTTP 对象的细节,通过使用 Sajax.php 库文件而被抽象出去。这使开发 Ajax 应用程序变得更加容易,因为编程出错的机会降低了。链接也变得更加容易,因为它们将只包含函数调用。基本上,Sajax 是一种制作 Ajax 应用程序的模块化方式,通过预定的、动态的函数调用,使得应用程序的开发过程更加平滑。

 

模拟异步 JavaScript

在这一节中,要使用 Sajax 的几个方面来模拟 Ajax。其中一个是 sajax_init,它初始化 Sajax 库。接下来是 sajax_export 函数,要调用它来通知 Sajax 有一个“面板”内容区,稍后会为它创建对应的 JavaScript 函数。针对应用程序需要的动态内容区的多少,可以根据需要为每个动态内容区调用 sajax_export,次数不限。

下一个要使用的函数是 sajax_handle_client_request。这个函数初始化 Sajax 的数据结构,让应用程序准备好处理客户请求。还要设置 $sajax_remote_uri。这是应用程序发送客户请求的目标 URL,与 Ajax 应用程序的链接中嵌入的 URL 类似。

最后,需要用 sajax_show_javascript 函数把 Sajax JavaScript 函数包含在 JavaScript 中。

 

幕后发生了什么?

现在会发生什么?在幕后,Sajax 起的作用实际与 Ajax 相同。但是,Sajax 会替您设置 XML HTTP 对象,从而简化开发工作。它允许应用程序使用 JavaScript 函数用一种模块化的方式拥有多个内容区。Sajax 包使得 Ajax 开发更有效率,同时具有同样的幕后功能。


初始化 Sajax

现在开始 Sajax 应用程序。请拷贝 ajax-app.php 文件并把拷贝改名为 sajax-app.php。把文件放在与 ajax-app.php 文件相同的目录中。添加以下代码到文件开始:


清单 13. 初始化 Sajax


					
<?
require("Sajax.php");

$sajax_remote_uri =
    "http://localhost.localdomain/ajax-sajax/panels-sajax.php";
sajax_init();
sajax_export("panels");
sajax_handle_client_request();
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
...

首先,需要设置远程 URL。然后需要初始化 Sajax 并导出“panels”。这对 Sajax 进行初始化,允许稍后创建的 JavaScript 函数去处理与“panels”内容相关的请求。


修改链接

链接现在需要包含函数,以便把面板 ID 传递给对应的 JavaScript 函数。


清单 14. 应用程序中的面板链接


					
<?php require('content/header.html'); ?>

<span onclick="getPanel(0)">Managing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(1)" >Adding content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(2)" >Saving new content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(3)" >Editing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(4)" >Saving edited content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(5)" >Avoid adding duplicates</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(6)" >Avoid editing a page
                            that doesn't exist</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(7)" >Deleting content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(8)" >Serving a page</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(9)">Pulling it together:
                            The CMS control page</span>

<?php require('content/pre-content.html'); ?>
...

点击链接会调用一个不同的 JavaScript 函数,接下来会添加这个函数。

 

替换 JavaScript

在继续之前,请从 Ajax 应用程序删除 JavaScrip。需要添加新的函数,这些新函数和 XML HTTP 对象无关。添加以下代码代替当前的 JavaScript 函数:


清单 15. 新的 JavaScript 函数


					
...
<script type="text/javascript">
    <?php sajax_show_javascript(); ?>

    function getPanel_cb(content) {
        document.getElementById('content').innerHTML = content;
    }

    function getPanel(panel_id){
        x_panels(panel_id, getPanel_cb);
    }
</script>
...

第一行调用 sajax_show_javascript,它导入 Sajax 需要的 JavaScript 函数和其他要添加的 getPanel 函数。这些添加的 JavaScript 函数把 Sajax 应用程序的核心带到浏览器,因为浏览器首次装入页面后,PHP 就没有作用了。

 

返回 Sajax 内容

现在需要修改 panels-ajax.php 文件以便适应 Sajax。拷贝并重命名 panels-ajax.php 文件为 panels-sajax.php 并把它放在与其他文件相同的目录下。修改它,如清单 16 所示。


清单 16. panels-sajax.php 的修改

___FCKpd___3

这个文件将检查通过 GET 提交的变量。请注意“panels”被发送给 sajax_import 函数。这应当是 GET 数组中 rs 变量的值。如果 $_GET['rs'] 的值是 panel,那么 panel_id 变量就包含在 $_GET['rsargs'][0] 中,这是发送给 x_panels 函数的第一个参数,由 Sajax 库自动生成。

在返回适当的面板之前,代码必须输出两个字符(它们好像是 Sajax 库的一个 bug)。这两个字符不会在显示的 Web 页面的 HTML 源代码中出现。接下来,必须用 $_GET['rsargs'][0] 替换剩下的到 $_GET['panel_id'] 的引用。最后,需要把导航链接修改成看起来与 sajax-app.php 文件中修改的链接一样。把对 loadHTML 的调用换成 getPanel,要像以前一样传递 ID。


图 5. 集成了 Sajax 后 PHP 应用程序的浏览器输出示例

图片URL:https://www6.software.ibm.com/developerworks/cn/education/opensource/os-phpajax/fig05.jpg

集成了 Sajax 后 PHP 应用程序的浏览器输出示例

应用程序的行为和输出示例如图 5 所示,与使用 Ajax 时的输出相同。


结束语

恭喜!您用 PHP 创建了 Ajax 应用程序并把它与 Sajax 成功地集成。这个应用程序(以及日后的异步 JavaScript 应用程序)会给使用它的那些人节约许多带宽和等候页面重载的时间,因为不必为每次点击都载入整个页面,只需载入必要的内容。这将使创建交互丰富的应用程序变得更为普遍。



下载
Source code for the PHP application:
ftp://www6.software.ibm.com/software/developer/library/os-phpajax.sajax.source.zip

说明:
本文来自:http://www.ibm.com/developerworks/cn/views/opensource/tutorials.jsp?cv_doc_id=109065
版权归属IBM所有,本Blog只是处于转载学习更多技术目的

 

GET['rs'] == 'panels'){
switch(

 

通过 PHP 和 Sajax 使用 Ajax (三)

简单 Ajax 工具包如何把服务器端 PHP 与 JavaScript 集成

Tyler Anderson , 自由作者, Stexar 公司
2006 年 05 月 11 日

与 Sajax 集成

这一节将介绍什么是 Sajax,它如何模拟异步 JavaScript,以及当前的 Ajax 应用程序怎样转化成 Sajax 应用程序。

什么是 Sajax?

简单 Ajax 工具包(Sajax)是同步的异步 JavaScript 和 XML。同步的原因是,当前应用程序中使用的 XML HTTP 对象的细节,通过使用 Sajax.php 库文件而被抽象出去。这使开发 Ajax 应用程序变得更加容易,因为编程出错的机会降低了。链接也变得更加容易,因为它们将只包含函数调用。基本上,Sajax 是一种制作 Ajax 应用程序的模块化方式,通过预定的、动态的函数调用,使得应用程序的开发过程更加平滑。

 

模拟异步 JavaScript

在这一节中,要使用 Sajax 的几个方面来模拟 Ajax。其中一个是 sajax_init,它初始化 Sajax 库。接下来是 sajax_export 函数,要调用它来通知 Sajax 有一个“面板”内容区,稍后会为它创建对应的 JavaScript 函数。针对应用程序需要的动态内容区的多少,可以根据需要为每个动态内容区调用 sajax_export,次数不限。

下一个要使用的函数是 sajax_handle_client_request。这个函数初始化 Sajax 的数据结构,让应用程序准备好处理客户请求。还要设置 $sajax_remote_uri。这是应用程序发送客户请求的目标 URL,与 Ajax 应用程序的链接中嵌入的 URL 类似。

最后,需要用 sajax_show_javascript 函数把 Sajax JavaScript 函数包含在 JavaScript 中。

 

幕后发生了什么?

现在会发生什么?在幕后,Sajax 起的作用实际与 Ajax 相同。但是,Sajax 会替您设置 XML HTTP 对象,从而简化开发工作。它允许应用程序使用 JavaScript 函数用一种模块化的方式拥有多个内容区。Sajax 包使得 Ajax 开发更有效率,同时具有同样的幕后功能。


初始化 Sajax

现在开始 Sajax 应用程序。请拷贝 ajax-app.php 文件并把拷贝改名为 sajax-app.php。把文件放在与 ajax-app.php 文件相同的目录中。添加以下代码到文件开始:


清单 13. 初始化 Sajax


					
<?
require("Sajax.php");

$sajax_remote_uri =
    "http://localhost.localdomain/ajax-sajax/panels-sajax.php";
sajax_init();
sajax_export("panels");
sajax_handle_client_request();
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
...

首先,需要设置远程 URL。然后需要初始化 Sajax 并导出“panels”。这对 Sajax 进行初始化,允许稍后创建的 JavaScript 函数去处理与“panels”内容相关的请求。


修改链接

链接现在需要包含函数,以便把面板 ID 传递给对应的 JavaScript 函数。


清单 14. 应用程序中的面板链接


					
<?php require('content/header.html'); ?>

<span onclick="getPanel(0)">Managing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(1)" >Adding content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(2)" >Saving new content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(3)" >Editing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(4)" >Saving edited content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(5)" >Avoid adding duplicates</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(6)" >Avoid editing a page
                            that doesn't exist</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(7)" >Deleting content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(8)" >Serving a page</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(9)">Pulling it together:
                            The CMS control page</span>

<?php require('content/pre-content.html'); ?>
...

点击链接会调用一个不同的 JavaScript 函数,接下来会添加这个函数。

 

替换 JavaScript

在继续之前,请从 Ajax 应用程序删除 JavaScrip。需要添加新的函数,这些新函数和 XML HTTP 对象无关。添加以下代码代替当前的 JavaScript 函数:


清单 15. 新的 JavaScript 函数


					
...
<script type="text/javascript">
    <?php sajax_show_javascript(); ?>

    function getPanel_cb(content) {
        document.getElementById('content').innerHTML = content;
    }

    function getPanel(panel_id){
        x_panels(panel_id, getPanel_cb);
    }
</script>
...

第一行调用 sajax_show_javascript,它导入 Sajax 需要的 JavaScript 函数和其他要添加的 getPanel 函数。这些添加的 JavaScript 函数把 Sajax 应用程序的核心带到浏览器,因为浏览器首次装入页面后,PHP 就没有作用了。

 

返回 Sajax 内容

现在需要修改 panels-ajax.php 文件以便适应 Sajax。拷贝并重命名 panels-ajax.php 文件为 panels-sajax.php 并把它放在与其他文件相同的目录下。修改它,如清单 16 所示。


清单 16. panels-sajax.php 的修改

___FCKpd___3

这个文件将检查通过 GET 提交的变量。请注意“panels”被发送给 sajax_import 函数。这应当是 GET 数组中 rs 变量的值。如果 $_GET['rs'] 的值是 panel,那么 panel_id 变量就包含在 $_GET['rsargs'][0] 中,这是发送给 x_panels 函数的第一个参数,由 Sajax 库自动生成。

在返回适当的面板之前,代码必须输出两个字符(它们好像是 Sajax 库的一个 bug)。这两个字符不会在显示的 Web 页面的 HTML 源代码中出现。接下来,必须用 $_GET['rsargs'][0] 替换剩下的到 $_GET['panel_id'] 的引用。最后,需要把导航链接修改成看起来与 sajax-app.php 文件中修改的链接一样。把对 loadHTML 的调用换成 getPanel,要像以前一样传递 ID。


图 5. 集成了 Sajax 后 PHP 应用程序的浏览器输出示例

图片URL:https://www6.software.ibm.com/developerworks/cn/education/opensource/os-phpajax/fig05.jpg

集成了 Sajax 后 PHP 应用程序的浏览器输出示例

应用程序的行为和输出示例如图 5 所示,与使用 Ajax 时的输出相同。


结束语

恭喜!您用 PHP 创建了 Ajax 应用程序并把它与 Sajax 成功地集成。这个应用程序(以及日后的异步 JavaScript 应用程序)会给使用它的那些人节约许多带宽和等候页面重载的时间,因为不必为每次点击都载入整个页面,只需载入必要的内容。这将使创建交互丰富的应用程序变得更为普遍。



下载
Source code for the PHP application:
ftp://www6.software.ibm.com/software/developer/library/os-phpajax.sajax.source.zip

说明:
本文来自:http://www.ibm.com/developerworks/cn/views/opensource/tutorials.jsp?cv_doc_id=109065
版权归属IBM所有,本Blog只是处于转载学习更多技术目的

 

GET['rsargs'][0]){
case 0: ... case 9: print("##"); require('content/panel-'.

 

通过 PHP 和 Sajax 使用 Ajax (三)

简单 Ajax 工具包如何把服务器端 PHP 与 JavaScript 集成

Tyler Anderson , 自由作者, Stexar 公司
2006 年 05 月 11 日

与 Sajax 集成

这一节将介绍什么是 Sajax,它如何模拟异步 JavaScript,以及当前的 Ajax 应用程序怎样转化成 Sajax 应用程序。

什么是 Sajax?

简单 Ajax 工具包(Sajax)是同步的异步 JavaScript 和 XML。同步的原因是,当前应用程序中使用的 XML HTTP 对象的细节,通过使用 Sajax.php 库文件而被抽象出去。这使开发 Ajax 应用程序变得更加容易,因为编程出错的机会降低了。链接也变得更加容易,因为它们将只包含函数调用。基本上,Sajax 是一种制作 Ajax 应用程序的模块化方式,通过预定的、动态的函数调用,使得应用程序的开发过程更加平滑。

 

模拟异步 JavaScript

在这一节中,要使用 Sajax 的几个方面来模拟 Ajax。其中一个是 sajax_init,它初始化 Sajax 库。接下来是 sajax_export 函数,要调用它来通知 Sajax 有一个“面板”内容区,稍后会为它创建对应的 JavaScript 函数。针对应用程序需要的动态内容区的多少,可以根据需要为每个动态内容区调用 sajax_export,次数不限。

下一个要使用的函数是 sajax_handle_client_request。这个函数初始化 Sajax 的数据结构,让应用程序准备好处理客户请求。还要设置 $sajax_remote_uri。这是应用程序发送客户请求的目标 URL,与 Ajax 应用程序的链接中嵌入的 URL 类似。

最后,需要用 sajax_show_javascript 函数把 Sajax JavaScript 函数包含在 JavaScript 中。

 

幕后发生了什么?

现在会发生什么?在幕后,Sajax 起的作用实际与 Ajax 相同。但是,Sajax 会替您设置 XML HTTP 对象,从而简化开发工作。它允许应用程序使用 JavaScript 函数用一种模块化的方式拥有多个内容区。Sajax 包使得 Ajax 开发更有效率,同时具有同样的幕后功能。


初始化 Sajax

现在开始 Sajax 应用程序。请拷贝 ajax-app.php 文件并把拷贝改名为 sajax-app.php。把文件放在与 ajax-app.php 文件相同的目录中。添加以下代码到文件开始:


清单 13. 初始化 Sajax


					
<?
require("Sajax.php");

$sajax_remote_uri =
    "http://localhost.localdomain/ajax-sajax/panels-sajax.php";
sajax_init();
sajax_export("panels");
sajax_handle_client_request();
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
...

首先,需要设置远程 URL。然后需要初始化 Sajax 并导出“panels”。这对 Sajax 进行初始化,允许稍后创建的 JavaScript 函数去处理与“panels”内容相关的请求。


修改链接

链接现在需要包含函数,以便把面板 ID 传递给对应的 JavaScript 函数。


清单 14. 应用程序中的面板链接


					
<?php require('content/header.html'); ?>

<span onclick="getPanel(0)">Managing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(1)" >Adding content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(2)" >Saving new content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(3)" >Editing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(4)" >Saving edited content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(5)" >Avoid adding duplicates</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(6)" >Avoid editing a page
                            that doesn't exist</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(7)" >Deleting content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(8)" >Serving a page</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(9)">Pulling it together:
                            The CMS control page</span>

<?php require('content/pre-content.html'); ?>
...

点击链接会调用一个不同的 JavaScript 函数,接下来会添加这个函数。

 

替换 JavaScript

在继续之前,请从 Ajax 应用程序删除 JavaScrip。需要添加新的函数,这些新函数和 XML HTTP 对象无关。添加以下代码代替当前的 JavaScript 函数:


清单 15. 新的 JavaScript 函数


					
...
<script type="text/javascript">
    <?php sajax_show_javascript(); ?>

    function getPanel_cb(content) {
        document.getElementById('content').innerHTML = content;
    }

    function getPanel(panel_id){
        x_panels(panel_id, getPanel_cb);
    }
</script>
...

第一行调用 sajax_show_javascript,它导入 Sajax 需要的 JavaScript 函数和其他要添加的 getPanel 函数。这些添加的 JavaScript 函数把 Sajax 应用程序的核心带到浏览器,因为浏览器首次装入页面后,PHP 就没有作用了。

 

返回 Sajax 内容

现在需要修改 panels-ajax.php 文件以便适应 Sajax。拷贝并重命名 panels-ajax.php 文件为 panels-sajax.php 并把它放在与其他文件相同的目录下。修改它,如清单 16 所示。


清单 16. panels-sajax.php 的修改

___FCKpd___3

这个文件将检查通过 GET 提交的变量。请注意“panels”被发送给 sajax_import 函数。这应当是 GET 数组中 rs 变量的值。如果 $_GET['rs'] 的值是 panel,那么 panel_id 变量就包含在 $_GET['rsargs'][0] 中,这是发送给 x_panels 函数的第一个参数,由 Sajax 库自动生成。

在返回适当的面板之前,代码必须输出两个字符(它们好像是 Sajax 库的一个 bug)。这两个字符不会在显示的 Web 页面的 HTML 源代码中出现。接下来,必须用 $_GET['rsargs'][0] 替换剩下的到 $_GET['panel_id'] 的引用。最后,需要把导航链接修改成看起来与 sajax-app.php 文件中修改的链接一样。把对 loadHTML 的调用换成 getPanel,要像以前一样传递 ID。


图 5. 集成了 Sajax 后 PHP 应用程序的浏览器输出示例

图片URL:https://www6.software.ibm.com/developerworks/cn/education/opensource/os-phpajax/fig05.jpg

集成了 Sajax 后 PHP 应用程序的浏览器输出示例

应用程序的行为和输出示例如图 5 所示,与使用 Ajax 时的输出相同。


结束语

恭喜!您用 PHP 创建了 Ajax 应用程序并把它与 Sajax 成功地集成。这个应用程序(以及日后的异步 JavaScript 应用程序)会给使用它的那些人节约许多带宽和等候页面重载的时间,因为不必为每次点击都载入整个页面,只需载入必要的内容。这将使创建交互丰富的应用程序变得更为普遍。



下载
Source code for the PHP application:
ftp://www6.software.ibm.com/software/developer/library/os-phpajax.sajax.source.zip

说明:
本文来自:http://www.ibm.com/developerworks/cn/views/opensource/tutorials.jsp?cv_doc_id=109065
版权归属IBM所有,本Blog只是处于转载学习更多技术目的

 

GET['rsargs'][0]
.'.html'); $panel_id_next =

 

通过 PHP 和 Sajax 使用 Ajax (三)

简单 Ajax 工具包如何把服务器端 PHP 与 JavaScript 集成

Tyler Anderson , 自由作者, Stexar 公司
2006 年 05 月 11 日

与 Sajax 集成

这一节将介绍什么是 Sajax,它如何模拟异步 JavaScript,以及当前的 Ajax 应用程序怎样转化成 Sajax 应用程序。

什么是 Sajax?

简单 Ajax 工具包(Sajax)是同步的异步 JavaScript 和 XML。同步的原因是,当前应用程序中使用的 XML HTTP 对象的细节,通过使用 Sajax.php 库文件而被抽象出去。这使开发 Ajax 应用程序变得更加容易,因为编程出错的机会降低了。链接也变得更加容易,因为它们将只包含函数调用。基本上,Sajax 是一种制作 Ajax 应用程序的模块化方式,通过预定的、动态的函数调用,使得应用程序的开发过程更加平滑。

 

模拟异步 JavaScript

在这一节中,要使用 Sajax 的几个方面来模拟 Ajax。其中一个是 sajax_init,它初始化 Sajax 库。接下来是 sajax_export 函数,要调用它来通知 Sajax 有一个“面板”内容区,稍后会为它创建对应的 JavaScript 函数。针对应用程序需要的动态内容区的多少,可以根据需要为每个动态内容区调用 sajax_export,次数不限。

下一个要使用的函数是 sajax_handle_client_request。这个函数初始化 Sajax 的数据结构,让应用程序准备好处理客户请求。还要设置 $sajax_remote_uri。这是应用程序发送客户请求的目标 URL,与 Ajax 应用程序的链接中嵌入的 URL 类似。

最后,需要用 sajax_show_javascript 函数把 Sajax JavaScript 函数包含在 JavaScript 中。

 

幕后发生了什么?

现在会发生什么?在幕后,Sajax 起的作用实际与 Ajax 相同。但是,Sajax 会替您设置 XML HTTP 对象,从而简化开发工作。它允许应用程序使用 JavaScript 函数用一种模块化的方式拥有多个内容区。Sajax 包使得 Ajax 开发更有效率,同时具有同样的幕后功能。


初始化 Sajax

现在开始 Sajax 应用程序。请拷贝 ajax-app.php 文件并把拷贝改名为 sajax-app.php。把文件放在与 ajax-app.php 文件相同的目录中。添加以下代码到文件开始:


清单 13. 初始化 Sajax


					
<?
require("Sajax.php");

$sajax_remote_uri =
    "http://localhost.localdomain/ajax-sajax/panels-sajax.php";
sajax_init();
sajax_export("panels");
sajax_handle_client_request();
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
...

首先,需要设置远程 URL。然后需要初始化 Sajax 并导出“panels”。这对 Sajax 进行初始化,允许稍后创建的 JavaScript 函数去处理与“panels”内容相关的请求。


修改链接

链接现在需要包含函数,以便把面板 ID 传递给对应的 JavaScript 函数。


清单 14. 应用程序中的面板链接


					
<?php require('content/header.html'); ?>

<span onclick="getPanel(0)">Managing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(1)" >Adding content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(2)" >Saving new content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(3)" >Editing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(4)" >Saving edited content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(5)" >Avoid adding duplicates</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(6)" >Avoid editing a page
                            that doesn't exist</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(7)" >Deleting content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(8)" >Serving a page</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(9)">Pulling it together:
                            The CMS control page</span>

<?php require('content/pre-content.html'); ?>
...

点击链接会调用一个不同的 JavaScript 函数,接下来会添加这个函数。

 

替换 JavaScript

在继续之前,请从 Ajax 应用程序删除 JavaScrip。需要添加新的函数,这些新函数和 XML HTTP 对象无关。添加以下代码代替当前的 JavaScript 函数:


清单 15. 新的 JavaScript 函数


					
...
<script type="text/javascript">
    <?php sajax_show_javascript(); ?>

    function getPanel_cb(content) {
        document.getElementById('content').innerHTML = content;
    }

    function getPanel(panel_id){
        x_panels(panel_id, getPanel_cb);
    }
</script>
...

第一行调用 sajax_show_javascript,它导入 Sajax 需要的 JavaScript 函数和其他要添加的 getPanel 函数。这些添加的 JavaScript 函数把 Sajax 应用程序的核心带到浏览器,因为浏览器首次装入页面后,PHP 就没有作用了。

 

返回 Sajax 内容

现在需要修改 panels-ajax.php 文件以便适应 Sajax。拷贝并重命名 panels-ajax.php 文件为 panels-sajax.php 并把它放在与其他文件相同的目录下。修改它,如清单 16 所示。


清单 16. panels-sajax.php 的修改

___FCKpd___3

这个文件将检查通过 GET 提交的变量。请注意“panels”被发送给 sajax_import 函数。这应当是 GET 数组中 rs 变量的值。如果 $_GET['rs'] 的值是 panel,那么 panel_id 变量就包含在 $_GET['rsargs'][0] 中,这是发送给 x_panels 函数的第一个参数,由 Sajax 库自动生成。

在返回适当的面板之前,代码必须输出两个字符(它们好像是 Sajax 库的一个 bug)。这两个字符不会在显示的 Web 页面的 HTML 源代码中出现。接下来,必须用 $_GET['rsargs'][0] 替换剩下的到 $_GET['panel_id'] 的引用。最后,需要把导航链接修改成看起来与 sajax-app.php 文件中修改的链接一样。把对 loadHTML 的调用换成 getPanel,要像以前一样传递 ID。


图 5. 集成了 Sajax 后 PHP 应用程序的浏览器输出示例

图片URL:https://www6.software.ibm.com/developerworks/cn/education/opensource/os-phpajax/fig05.jpg

集成了 Sajax 后 PHP 应用程序的浏览器输出示例

应用程序的行为和输出示例如图 5 所示,与使用 Ajax 时的输出相同。


结束语

恭喜!您用 PHP 创建了 Ajax 应用程序并把它与 Sajax 成功地集成。这个应用程序(以及日后的异步 JavaScript 应用程序)会给使用它的那些人节约许多带宽和等候页面重载的时间,因为不必为每次点击都载入整个页面,只需载入必要的内容。这将使创建交互丰富的应用程序变得更为普遍。



下载
Source code for the PHP application:
ftp://www6.software.ibm.com/software/developer/library/os-phpajax.sajax.source.zip

说明:
本文来自:http://www.ibm.com/developerworks/cn/views/opensource/tutorials.jsp?cv_doc_id=109065
版权归属IBM所有,本Blog只是处于转载学习更多技术目的

 

GET['rsargs'][0]
+ 1; $panel_id_prev =

 

通过 PHP 和 Sajax 使用 Ajax (三)

简单 Ajax 工具包如何把服务器端 PHP 与 JavaScript 集成

Tyler Anderson , 自由作者, Stexar 公司
2006 年 05 月 11 日

与 Sajax 集成

这一节将介绍什么是 Sajax,它如何模拟异步 JavaScript,以及当前的 Ajax 应用程序怎样转化成 Sajax 应用程序。

什么是 Sajax?

简单 Ajax 工具包(Sajax)是同步的异步 JavaScript 和 XML。同步的原因是,当前应用程序中使用的 XML HTTP 对象的细节,通过使用 Sajax.php 库文件而被抽象出去。这使开发 Ajax 应用程序变得更加容易,因为编程出错的机会降低了。链接也变得更加容易,因为它们将只包含函数调用。基本上,Sajax 是一种制作 Ajax 应用程序的模块化方式,通过预定的、动态的函数调用,使得应用程序的开发过程更加平滑。

 

模拟异步 JavaScript

在这一节中,要使用 Sajax 的几个方面来模拟 Ajax。其中一个是 sajax_init,它初始化 Sajax 库。接下来是 sajax_export 函数,要调用它来通知 Sajax 有一个“面板”内容区,稍后会为它创建对应的 JavaScript 函数。针对应用程序需要的动态内容区的多少,可以根据需要为每个动态内容区调用 sajax_export,次数不限。

下一个要使用的函数是 sajax_handle_client_request。这个函数初始化 Sajax 的数据结构,让应用程序准备好处理客户请求。还要设置 $sajax_remote_uri。这是应用程序发送客户请求的目标 URL,与 Ajax 应用程序的链接中嵌入的 URL 类似。

最后,需要用 sajax_show_javascript 函数把 Sajax JavaScript 函数包含在 JavaScript 中。

 

幕后发生了什么?

现在会发生什么?在幕后,Sajax 起的作用实际与 Ajax 相同。但是,Sajax 会替您设置 XML HTTP 对象,从而简化开发工作。它允许应用程序使用 JavaScript 函数用一种模块化的方式拥有多个内容区。Sajax 包使得 Ajax 开发更有效率,同时具有同样的幕后功能。


初始化 Sajax

现在开始 Sajax 应用程序。请拷贝 ajax-app.php 文件并把拷贝改名为 sajax-app.php。把文件放在与 ajax-app.php 文件相同的目录中。添加以下代码到文件开始:


清单 13. 初始化 Sajax


					
<?
require("Sajax.php");

$sajax_remote_uri =
    "http://localhost.localdomain/ajax-sajax/panels-sajax.php";
sajax_init();
sajax_export("panels");
sajax_handle_client_request();
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
...

首先,需要设置远程 URL。然后需要初始化 Sajax 并导出“panels”。这对 Sajax 进行初始化,允许稍后创建的 JavaScript 函数去处理与“panels”内容相关的请求。


修改链接

链接现在需要包含函数,以便把面板 ID 传递给对应的 JavaScript 函数。


清单 14. 应用程序中的面板链接


					
<?php require('content/header.html'); ?>

<span onclick="getPanel(0)">Managing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(1)" >Adding content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(2)" >Saving new content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(3)" >Editing content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(4)" >Saving edited content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(5)" >Avoid adding duplicates</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(6)" >Avoid editing a page
                            that doesn't exist</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(7)" >Deleting content</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(8)" >Serving a page</span>
<?php require('content/between-link.html'); ?>

<span onclick="getPanel(9)">Pulling it together:
                            The CMS control page</span>

<?php require('content/pre-content.html'); ?>
...

点击链接会调用一个不同的 JavaScript 函数,接下来会添加这个函数。

 

替换 JavaScript

在继续之前,请从 Ajax 应用程序删除 JavaScrip。需要添加新的函数,这些新函数和 XML HTTP 对象无关。添加以下代码代替当前的 JavaScript 函数:


清单 15. 新的 JavaScript 函数


					
...
<script type="text/javascript">
    <?php sajax_show_javascript(); ?>

    function getPanel_cb(content) {
        document.getElementById('content').innerHTML = content;
    }

    function getPanel(panel_id){
        x_panels(panel_id, getPanel_cb);
    }
</script>
...

第一行调用 sajax_show_javascript,它导入 Sajax 需要的 JavaScript 函数和其他要添加的 getPanel 函数。这些添加的 JavaScript 函数把 Sajax 应用程序的核心带到浏览器,因为浏览器首次装入页面后,PHP 就没有作用了。

 

返回 Sajax 内容

现在需要修改 panels-ajax.php 文件以便适应 Sajax。拷贝并重命名 panels-ajax.php 文件为 panels-sajax.php 并把它放在与其他文件相同的目录下。修改它,如清单 16 所示。


清单 16. panels-sajax.php 的修改

___FCKpd___3

这个文件将检查通过 GET 提交的变量。请注意“panels”被发送给 sajax_import 函数。这应当是 GET 数组中 rs 变量的值。如果 $_GET['rs'] 的值是 panel,那么 panel_id 变量就包含在 $_GET['rsargs'][0] 中,这是发送给 x_panels 函数的第一个参数,由 Sajax 库自动生成。

在返回适当的面板之前,代码必须输出两个字符(它们好像是 Sajax 库的一个 bug)。这两个字符不会在显示的 Web 页面的 HTML 源代码中出现。接下来,必须用 $_GET['rsargs'][0] 替换剩下的到 $_GET['panel_id'] 的引用。最后,需要把导航链接修改成看起来与 sajax-app.php 文件中修改的链接一样。把对 loadHTML 的调用换成 getPanel,要像以前一样传递 ID。


图 5. 集成了 Sajax 后 PHP 应用程序的浏览器输出示例

图片URL:https://www6.software.ibm.com/developerworks/cn/education/opensource/os-phpajax/fig05.jpg

集成了 Sajax 后 PHP 应用程序的浏览器输出示例

应用程序的行为和输出示例如图 5 所示,与使用 Ajax 时的输出相同。


结束语

恭喜!您用 PHP 创建了 Ajax 应用程序并把它与 Sajax 成功地集成。这个应用程序(以及日后的异步 JavaScript 应用程序)会给使用它的那些人节约许多带宽和等候页面重载的时间,因为不必为每次点击都载入整个页面,只需载入必要的内容。这将使创建交互丰富的应用程序变得更为普遍。



下载
Source code for the PHP application:
ftp://www6.software.ibm.com/software/developer/library/os-phpajax.sajax.source.zip

说明:
本文来自:http://www.ibm.com/developerworks/cn/views/opensource/tutorials.jsp?cv_doc_id=109065
版权归属IBM所有,本Blog只是处于转载学习更多技术目的

 

GET['rsargs'][0]
- 1; if($panel_id_prev > = 0){ print(" <span onclick=/"getPanel(".$panel_id_prev.")/">Previous Panel</span> "); ... print(" <span onclick=/"getPanel(".$panel_id_next.")/">Next Panel</span> "); ...

这个文件将检查通过 GET 提交的变量。请注意“panels”被发送给 sajax_import 函数。这应当是 GET 数组中 rs 变量的值。如果 $_GET['rs'] 的值是 panel,那么 panel_id 变量就包含在 $_GET['rsargs'][0] 中,这是发送给 x_panels 函数的第一个参数,由 Sajax 库自动生成。

在返回适当的面板之前,代码必须输出两个字符(它们好像是 Sajax 库的一个 bug)。这两个字符不会在显示的 Web 页面的 HTML 源代码中出现。接下来,必须用 $_GET['rsargs'][0] 替换剩下的到 $_GET['panel_id'] 的引用。最后,需要把导航链接修改成看起来与 sajax-app.php 文件中修改的链接一样。把对 loadHTML 的调用换成 getPanel,要像以前一样传递 ID。


图 5. 集成了 Sajax 后 PHP 应用程序的浏览器输出示例

图片URL:https://www6.software.ibm.com/developerworks/cn/education/opensource/os-phpajax/fig05.jpg

集成了 Sajax 后 PHP 应用程序的浏览器输出示例

应用程序的行为和输出示例如图 5 所示,与使用 Ajax 时的输出相同。


结束语

恭喜!您用 PHP 创建了 Ajax 应用程序并把它与 Sajax 成功地集成。这个应用程序(以及日后的异步 JavaScript 应用程序)会给使用它的那些人节约许多带宽和等候页面重载的时间,因为不必为每次点击都载入整个页面,只需载入必要的内容。这将使创建交互丰富的应用程序变得更为普遍。



下载
Source code for the PHP application:
ftp://www6.software.ibm.com/software/developer/library/os-phpajax.sajax.source.zip

说明:
本文来自:http://www.ibm.com/developerworks/cn/views/opensource/tutorials.jsp?cv_doc_id=109065
版权归属IBM所有,本Blog只是处于转载学习更多技术目的

 

PHP中Ajax使用总结

Ajax的全称是“Asynchronous JavaScript And XML”,它不是一门新语言,而是一种新技术,它可以创建更好、更快及交互性更强的Web应用程序。Ajax使用了JavaScrip...
  • why_2012_gogo
  • why_2012_gogo
  • 2016年03月16日 09:41
  • 1677

PHP中AJAX的使用(完整实例【大牛可飘过】)

有一段时间不写关于AJAX的东西了,最近和同学参加个比赛,要做一个类似博客的东西,用到了AJAX的东西,在写东西之前为了再熟悉一下AJAX,自己做了个关于AJAX的小事例与大家分享一下。   AJA...
  • u012767263
  • u012767263
  • 2014年01月17日 21:59
  • 3936

利用ajax实现与php数据交互,并局部刷新页面

利用ajax实现与php数据交互,并局部刷新页面本文主要有以下几个要点: ajax的基本语法结构 jQuery基本语法 json数组基本结构 ajax回调函数中的json数组解析及局部刷新 php基本...
  • haibusoi
  • haibusoi
  • 2015年11月05日 15:19
  • 10244

php与ajax交互——实现php实时返回结果给ajax,并在后台保持继续运行的方法

一个简单的让php将结果返回前端,并继续在后台运行的方法
  • u011832039
  • u011832039
  • 2016年05月12日 21:03
  • 7861

jQuery ajax与php进行数据交互(数据格式问题)

近期涉及到 jquery 开发,因此对jQuery做了一些初步的学习,jquery功能相对比较强大些,尤其是对ajax支持,jquery ajax与服务器交互,这种搭配使得“局部刷新,异步更新”交互方...
  • dahuzix
  • dahuzix
  • 2013年06月03日 20:57
  • 1987

Ajax+PHP简单数据交互

PHP是一种创建动态交互性站点的服务器端脚本语言,优势:PHP脚本语言应用广泛,开源免费,最重要的是入门简单,容易掌握。 PHP能够生成动态页面内容 PHP能够创建、打开、读取、写入、删除以及关闭...
  • u014725878
  • u014725878
  • 2016年10月12日 03:34
  • 1039

php+ajax实现无刷新动态加载数据技术 - 测试用了,效果还行

php+ajax实现无刷新动态加载数据技术 - 测试用了,效果还行 感觉IE下略慢,非IE速度可以,好像是不能用jquery-1.11.1.min.js,只能用网上找的代码中提供的JQuery.js...
  • zyytaiyame
  • zyytaiyame
  • 2016年12月28日 10:26
  • 492

基于PHP与Ajax的表单验证功能

博客原文地址:http://www.kapeter.com/archives/312 直接进入正题。 今天讨论的是基于PHP与Ajax的表单验证功能,因此我们把关注点放在功能的实现,界面代码部...
  • qq_30382059
  • qq_30382059
  • 2015年08月06日 13:55
  • 1342

jQuery通过Ajax向PHP服务端发送请求并返回JSON数据

首先需要详看: http://blog.csdn.net/sunchengwei/article/details/6675537 http://www.helloweba.com/view-blo...
  • pan_xi_yi
  • pan_xi_yi
  • 2016年05月14日 15:19
  • 1126

jquery+ajax+php实现搜索功能

html代码 搜索 搜索 function search(){ var keyword=$("#gover_search_key").val(); $.ajax({ ...
  • less_cold
  • less_cold
  • 2016年08月29日 15:36
  • 2843
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:[转] 通过 PHP 和 Sajax 使用 Ajax(三)
举报原因:
原因补充:

(最多只允许输入30个字)