asp.net+ajax仿搜索提示效果代码

    技术2025-08-29  14

    JS代码:

     

    //创建一个xmlhttp对象 function createXmlHttp() {     var xmlHttp;     // 检测MSXMLHTTP版本,为了兼容IE各个版本     var activeKey = new Array("MSXML2.XMLHTTP.5.0","MSXML2.XMLHTTP.4.0","MSXML2.XMLHTTP.3.0","MSXML2.XMLHTTP","Microsoft.XMLHTTP");     if(window.ActiveXObject)     {        for(var i=0;i<activeKey.length;i++)        {           try           {               xmlHttp = new ActiveXObject(activeKey[i]);               if(xmlHttp!=null)                  return xmlHttp;           }           catch(error)           {               throw new Error("您的浏览器版本过低,请更新浏览器");           }        }     }     else if(window.XMLHttpRequest)     {        xmlHttp = new XMLHttpRequest();     }     return xmlHttp;  }

    var queryField; var globalDiv; var divName="globalDiv"; var xmlDoc; var xmlhttp=null; var array=new Array();

    //初始化函数 function ini(textid) {   queryField=document.getElementById(textid);   queryField.οnkeyup=keyhand; } //松开键盘事件 function keyhand() {   //var textvalue=document.getElementById("Text1").value;   var textvalue=queryField.value;   //判断是否按的是向上 向下键  或tab键 回车键    if(event.keyCode!=13&event.keyCode!=9&event.keyCode!=38&event.keyCode!=40)    {         if(textvalue.length>0)         {            postRequest(textvalue);         }         else         {             getDiv(divName);             hiddenDiv();             document.getElementById("ddlCengWei").options.length=0;             document.getElementById("ddlCSRQ").options.length=0;         }    }   }

    //与服务端通信 function postRequest(obj) {     var URL="Server.aspx?action=search&data="+obj;     xmlhttp = createXmlHttp();     xmlhttp.Open("POST",URL, true);     //响应服务端函数     xmlhttp.onreadystatechange=function()     {         if (xmlhttp.readyState == 4)          {            if(xmlhttp.status==200)            {                xmlDoc = new ActiveXObject("Microsoft.XMLDOM");                xmlDoc.loadXML(xmlhttp.responseText);                array.length=0;                //获得服务器返回的结果                 var res= xmlDoc.documentElement.selectNodes("result");                  for(var i=0;i<res.length;i++)                  {                      array[i]=res[i].text;                  }                  if(array.length>0)                  {                     getDiv(divName);                     showQueryDiv(array);                  }                  else                  {                     getDiv(divName);                     hiddenDiv();                  }             }          }     }     xmlhttp.SetRequestHeader ("Content-Type","text/xml; charset=GB2312");                xmlhttp.Send(null); } //创建显示DIV function getDiv(divId) {   if(!globalDiv)   {     var newNode=document.createElement("div");     newNode.setAttribute("id",divId);     document.body.appendChild(newNode);     globalDiv=document.getElementById(divId);   }   var x=queryField.offsetLeft;   var y=queryField.offsetTop+queryField.offsetHeight;   var parent=queryField;   while(parent.offsetParent)   {     parent=parent.offsetParent;     x+=parent.offsetLeft;     y+=parent.offsetTop;   }     globalDiv.style.border="2px solid #ccc";   globalDiv.style.position="absolute";   globalDiv.style.left=x+"px";   globalDiv.style.top=y+"px";   globalDiv.style.width="100px";   globalDiv.style.cursor="default";   globalDiv.style.color="Black";     return globalDiv;   } //显示查询数据 function showQueryDiv(resultArray) {   var parentDiv=getDiv(divName);   parentDiv.style.display="block";   while(parentDiv.childNodes.length>0)   {     parentDiv.removeChild(parentDiv.childNodes[0]);   }   for(i=0;i<resultArray.length;i++)   {     sonDiv=document.createElement("div");     sonDiv.innerHTML=resultArray[i];     sonDiv.οnmοusemοve=divMove;     sonDiv.οnmοuseοut=divout;     sonDiv.οnmοusedοwn=divdown;     //sonDiv.οnkeydοwn=beKeyDown;     parentDiv.appendChild(sonDiv);   } }

    function divout() {   var mydiv=this;   mydiv.style.backgroundColor=""; } //鼠标移到选项的效果 function divMove() {   var mydiv=this;   mydiv.style.backgroundColor="Blue"; } //鼠标点击事件 function divdown() {   var mydiv=this;   queryField.value=mydiv.innerHTML;   globalDiv.style.display="none"; } //没有相应数据隐藏DIV function hiddenDiv() {     globalDiv.style.display="none";     globalDiv.innerHTML=""; }

    //方向键接收函数 function beKeyDown() {     //往向下键     if (event.keyCode==40)     {         divMove();     }     //往向上按     if (event.keyCode==38)     {         divMove();     }     //按回车或者TAB     if (event.keyCode==13||event.keyCode==9)     {         divdown();     } }

     

    在页面onload事件中添加引用:<body οnlοad="ini('txtJingHao');">

    <asp:TextBox ID="txtJingHao" runat="server" Width="100px" style="z-index: 100;" ><asp:TextBox>

    Server.aspx.cs 代码:

     

    protected void Page_Load(object sender, EventArgs e)         {             if (!string.IsNullOrEmpty(Request.QueryString["action"]))             {                 string str = Request.QueryString["action"].ToString();                 switch (Request.QueryString["action"].ToString())                 {                         case "search":  //查询                         GetResult();                         break;                  }             }         }

     

     

     /// <summary>         /// 查询         /// </summary>         private void GetResult()         {             string res = "";             ProjectInfoBLL PIBll = new ProjectInfoBLL();             string data = Request.QueryString["data"].ToString();             DataTable objTable = PIBll.GetProjectInfosByJingHao(data);             int rowCount = objTable.Rows.Count;             //输出数据             res = "<root>";             if (rowCount > 0)             {                 for (int i = 0; i < rowCount; i++)                 {                     res += "<result>";                     res += objTable.Rows[i][0].ToString().Trim();                     res += "</result>";                 }             }             res += "</root>";             Response.Clear();             Response.ContentType = "text/xml";             Response.ContentEncoding = System.Text.Encoding.GetEncoding("GB2312");             Response.Write("<?xml version=/"1.0/" encoding=/"GB2312/" ?>");             Response.Write(res);             Response.End();         }

    最新回复(0)