ajax制作类似google搜索

<script type="text/javascript">
var xmlHttp;//定义XmlHttpRequest对象
function createXmlHttp()//create object
{
try
{
xmlHttp=new XMLHttpRequest();
}
catch(microsoft)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(othermicrosoft)
{
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(failed)
{
xmlHttp=false;
}
}
}
}
//ul的focusout事件 失去焦点时隐藏智能提示
function FocusOut()
{
var ob=event.srcElement;
ob.style.display='none';
}
//LI上的鼠标Over事件 改变背景色
function MouseOver()
{
var ob=event.srcElement;
ob.style.backgroundColor='#E0E0E0';
}
//LI上的鼠标Out事件 背景色还原
function MouseOut()
{
var ob=event.srcElement;
ob.style.backgroundColor='#fff';
}
//LI上的鼠标Click事件 获得智能提示的列表框值
function Click()
{
var ob=event.srcElement;
document.getElementById("Search1_txtKey").value=ob.innerText;
document.getElementById("hint").style.display='none';
}
function getInformation(obj)
{
//输入框值为空 搜索按钮不可用
if(obj.value=="")
{
document.getElementById("<%=btnSearch.ClientID%>").disabled=true;
return;
}
document.getElementById("<%=btnSearch.ClientID%>").disabled=false;
createXmlHttp();
var url="/News/AjaxPage/DealNews.aspx?name="+escape(obj.value);//传递中文必须编码
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange=handleRequest;
xmlHttp.send(null);
}
function handleRequest()
{
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
//清空智能提示框
var oldChild=document.getElementById("hint").childNodes;
for(i=0;i<oldChild.length;i++)
{
document.getElementById("hint").removeChild(oldChild[i]);
}
//获得返回值
var xmlDoc=xmlHttp.responseXML;
var nodes=xmlDoc.selectNodes("//Element");
if(nodes.length<=0)
{
//如果得到的值为空就返回
return;
}
//得到了返回值 动态创建列表元素
var UL=document.createElement("UL");
UL.attachEvent('onmouseleave',FocusOut);
for(i=0;i<nodes.length;i++)
{
//创建LI对象
var LI=document.createElement("LI");
LI.innerText=nodes[i].firstChild.nodeValue;
//给li对象添加事件 用attachEvent绑定事件 用setAttribute好象不行
LI.attachEvent('onmouseover',MouseOver);
LI.attachEvent('onmouseout',MouseOut);
LI.attachEvent('onclick',Click);
UL.appendChild(LI);
}
//设置ul的高度
var height;
if(nodes.length<10)
{
height=nodes.length*20;
}
else
{
height=10*20;
}
UL.style.cssText="height:"+height+"px;width:100%;margin:0;padding:0;border:1px solid #758ca9;overflow:hidden;";//对UL设置css样式
document.getElementById("hint").appendChild(UL);
}
}
}