<html xmlns=" http://www.w3.org/1999/xhtml" >
<head>
<title>Live Search Ajax Example</title>
<script language="javascript" type="text/javascript" src="js/ajax.js"></script>
</head>
<body>
<h1>Live Search: Ajax Example</h1>
<form>
<p>
<b>Search for:</b><input type="text" size="40" id="searchlive" />
</p>
<div id="results">
<ul id="list">
<li>Results will display here.</li>
</ul>
</div>
</form>
<script language="javascript" type="text/javascript" src="js/search.js"></script>
</body>
</html>
下面是js文件的ajax.js
var ajaxreq=false,ajaxCallback;
function ajaxRequest(filename){
try{
//Firefox / IE7 ? Others / /火狐/ IE7？其他
ajaxCallback=new XMLHttpRequest();
}catch(Error){
try{
//IE5/IE6
ajaxreq=new ActiveXObject("Microsoft.XMLHTTP");
}catch(Error){
return false;
}
}
ajaxreq.open("GET",filename);
ajaxreq.onreadystatechange=ajaxResponse;
ajaxreq.send(null);
}
//ajaxResponse: Waits for response and calls a function/ / ajaxResponse：等待响应和调用一个函数
function ajaxResponse(){
if(ajaxreq.readyState!=4)return;
if(ajaxreq.status==200){
//if the request succeeded... / /如果请求成功...
if(ajaxCallback)ajaxCallback();
}else alert("Request failed:"+ajaxreq.statusText);
return true;
第二个js文件search.js
//global variable to manage the timeout/ /全局变量来管理超时
var t;
//start a timeout with each keypress/ /开始与每个按键超时
function StartSearch() {
if (t) window.clearTimeout(t);
t = window.setTimeout("LiveSearch()",200);
}
//perform the search /执行搜索
function LiveSearch() {
//assemble the PHP filename /装配的PHP文件名
query = document.getElementById("searchlive").value;
filename = "search.php?query=" + query;
//displayresuls will handle the ajax response/ / displayresuls将处理Ajax响应
ajaxCallback = DisplayResults;
//send the ajax request/ /发送Ajax请求
ajaxRequest(filename);
}
//Display search results /显示搜索结果
function DisplayResults() {
//remove old list /删除旧的列表
ul = document.getElementById("list");
div = document.getElementById("results");
div.removeChild(ul);
//make a new list/ /使一个新的列表
ul = document.createElement("UL");
ul.id = "list";
names = ajaxreq.responseXML.getElementsByTagName("name");
for (i = 0; i < names.length; i++) {
li = document.createElement("LI");
name = names[i].firstchild.nodeValue;
text = document.createTextNode(name);
li.appendChild(text);
ul.appendChild(li);
}
if (names.length == 0) {
li = document.createElement("LI");
li.appendChild(document.createTextNode("No results"));
ul.appendChild(li);
}
//display the new list/ /显示新的列表
div.appendChild(ul);
}
//set up event handler /设置事件处理程序
obj = document.getElementById("searchlive");
obj.onkeydown = StartSearch;
下面是php
<?php
header("Content-type:text/xml");
$names=array(
"John Smith","John Jones","Jane Smith","Jane Tillman","Abraham Lincoln","Sally Johnson","Kilgore Trout","Bob Atkinson","Joe Cool","Dorothy Barnes",
"Elizabeth Carlson","Frank Dixon","Gertrude East","Harvey Frank","Inigo Montoya","Jeff Austin","Lynn Arlington","Michael Washington","Nancy Wect");
if(!$query) $query=$_GET['query'];
echo "<?xml version=\"1.0\"?>\n";
echo "<names>\n";
while(list($k,$v)=each($names)){
if(stristr($v,$query))
echo "<name>$v</name>\n";
}
echo "</names>\n"
?>
读取到 names = ajaxreq.responseXML.getElementsByTagName("name");的时候
读不到php里面的东西 求高手解答