PHP+AJAX教程(4):PHP和AJAX XML实例
AJAX 可与 XML 文件进行交互式通信。
AJAX XML 实例
在下面的 AJAX 实例中，我们将演示网页如何使用 AJAX 技术从 XML 文件中读取信息。
在列表中选择一张 CD （测试说明：该实例功能未实现）
在此列出 CD 信息。本例包括三张页面：
- 一个简单 HTML 表单
- 一个 XML 文件
- 一个 JavaScript 文件
- 一张 PHP 页面
HTML 表单
上面的例子包含了一张简单的 HTML 表单，以及指向 JavaScript 的链接：
<html>
<head>
<script src="selectcd.js"></script>
</head>
<body>
<form>
Select a CD:
<select name="cds" onchange="showCD(this.value)">
<option value="Bob Dylan">Bob Dylan</option>
<option value="Bee Gees">Bee Gees</option>
<option value="Cat Stevens">Cat Stevens</option>
</select>
</form>
<p>
<div id="txtHint"><b>CD info will be listed here.</b></div>
</p>
</body>
</html>
例子解释：
正如您看到的，它仅仅是一张简单的 HTML 表单，其中带有名为 "cds" 的下拉列表。
表单下面的段落包含了一个名为 "txtHint" 的 div。这个 div 用作从 web 服务器检索到的数据的占位符。
当用户选择数据时，会执行名为 "showCD" 的函数。这个函数的执行是由 "onchange" 事件触发的。
换句话说，每当用户改变了下拉列表中的值，就会调用 showCD 函数。
XML 文件
XML 文件是 "cd_catalog.xml"。该文件中包含了有关 CD 收藏的数据。
JavaScript
这是存储在 "selectcd.js" 文件中的 JavaScript 代码：
var xmlHttp
function showCD(str)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="getcd.php"
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
相关新闻>>
- 发表评论
-
- 最新评论 更多>>
![smarty局部缓存技术[源码分析]](/uploads/allimg/130827/11214T939-0-lp.jpg)