asp.net+js实现的ajax sugguest搜索提示效果

2019-05-12 02:23:28王旭

keyDiv.style.width="100%";
keyDiv.style.padding="0";
keyDiv.style.margin="2px 0 2px 0";
keyDiv.style.height="18px";
keyDiv.style.lineHeight="18px";
keyDiv.style.cursor="default";
keyDiv.style.textIndent = "4px";

keyDiv.innerHTML = keynodes[i].getAttribute("value");

keyDiv.onmouseover=function(){
selectedIndex=-1;
divlist=suggestDiv.getElementsByTagName("div");
for(var k=0;k<divlist.length;k++){
divlist[k].className="";
if(divlist[k]==this)selectedIndex=k;
}
this.className="suggestOver";
};

keyDiv.onmouseout=function(){
this.className="";
};

keyDiv.onmousedown = function(){
document.getElementById("tbxsearch").value=this.innerHTML;
//这里写执行搜索的代码
};

suggestDiv.appendChild(keyDiv);
};

suggestDiv.style.display="block";
}else{
suggestDiv.style.display="none";
}
}
};
xmlHttp.send(null);
};
var changeSelect=function(isUp,inputObj){
if (isUp) selectedIndex++;
else selectedIndex--;
if(selectedIndex<0) selectedIndex=0;
var divlist=suggestDiv.getElementsByTagName("div");
if(selectedIndex>=divlist.length)
selectedIndex=divlist.length-1;
for(var i=0;i<divlist.length;i++){
if(i==selectedIndex){
divlist[i].className="suggestOver";
inputObj.value=divlist[i].innerHTML.replace(/<[^>]+>/g,"");
}else{
divlist[i].className="";
}
}
};
var suggest=function(event,inputObj){
event = event ? event : (window.event ? window.event : null);
var keyCode=event.keyCode;

if(keyCode==13){
if(selectedIndex != -1){
inputObj.value=keynodes[selectedIndex].getAttribute("value");
}
//这里写执行搜索
}

if(keyCode==40||keyCode==38){
var isUp=false;
if(keyCode==40) {isUp=true;}
changeSelect(isUp,inputObj);
}else{
showSuggest(inputObj);
}


};
var inputOnblur=function(){setTimeout('suggestDiv.style.display="none";',100);};

search.aspx代码:

<%@ Page Language="C#" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
Response.ContentType = "text/xml";
Response.ContentEncoding = Encoding.GetEncoding("utf-8");
Response.Write("<?xml version="1.0" encoding="utf-8"?>n");
Response.Write("<keylit>");
Response.Write("t<key value="阿会楠一直在坚持走自己的路" />n");
Response.Write("t<key value="阿会楠今年25岁了!" />n");
Response.Write("t<key value="阿会楠现在在汕头!" />n");
Response.Write("t<key value="阿会楠会回广州!" />n");
Response.Write("t<key value="搜索吧是阿会楠在大学期间的作品之一!" />n");
Response.Write("t<key value="sosuo8.com by ahuinan" />n");
Response.Write("</keylit>");

}
}
</script>

打包下载http://xiazai.jb51.net/200904/yuanma/ajaxsuggest.rar