Asp.net 模仿百度网站查询

 // JScript 文件

var xmlHttp;
var currentLine = - 1;
var divtable;

function $(o){
 return document.getElementById(o);
}

String.prototype.trim = function() {
    return this.replace(/(^[/s]*)|([/s]*$)/g, "");
}

function createXMLHttpRequest()
{
   if(window.ActiveXObject)
   {
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
   }
   else if(window.XMLHttpRequest)
   {
      xmlHttp = new XMLHttpRequest();
   }
}

function getSearchResult(queryurl)
{
e = window.event;
if(e.keyCode!=38 && e.keyCode!=40 && e.keyCode!=32)
{
   createXMLHttpRequest();
   url = queryurl;
   xmlHttp.open("GET", url, true);
   xmlHttp.onreadystatechange = callback;
   xmlHttp.send();
 }
 if(e.keyCode==32)
 {
 document.body.removeChild(divtable);
 }
}

function callback()
{
   if(xmlHttp.readyState == 4)
   {
      if(xmlHttp.status == 200)
      {
        if(xmlHttp.responseText.trim() == "")
        {
        if($("contents"))
            document.body.removeChild(divtable);
        }
        else
        {
        createTable(xmlHttp.responseText);
        }       
      }
   }
}

function createTable(strtable)
{
    if($("contents"))
    document.body.removeChild(divtable);
    divtable = document.createElement("div");
    divtable.setAttribute("id","contents");
    divtable.style.position="absolute";
    divtable.style.border="1px solid #817F82";
    divtable.style.background="#fff";
    divtable.innerHTML="";
    divtable.innerHTML=strtable;
    divtable.zIndex="400";
    divtable.style.width="auto";
    divtable.style.overflowY="auto";
    divtable.style.height="auto";
    divtable.style.top=$("txtkecode").offsetTop + $("txtkecode").offsetHeight + "px";
    divtable.style.left=$("txtkecode").offsetLeft + "px";
    document.body.appendChild(divtable);
}

document.onkeydown = function(e)
{
if(document.getElementById("ice"))
{
   e = window.event || e;
   switch(e.keyCode)
   {
      case 38 :
         // 上方向键
         currentLine -- ;
         changeItem();
         break;
      case 40 :
         // 下方向键
         currentLine ++ ;
         changeItem();
         break;
         case 32:
         document.body.appendChild(divtable);
         break;
      default :
         break;
   }
   }
}

// 选择行
function changeItem()
{
   if(document.all)
   {
      var it = document.getElementById("ice").children[0];
   }
   else
   {
      var it = document.getElementById("ice");
   }
   for(var j = 0; j < it.rows.length; j ++ )
   {
      it.rows[j].className = "";
   }
   if(currentLine < 0)
   {
      currentLine = it.rows.length - 1;
   }
   if(currentLine == it.rows.length)
   {
      currentLine = 0;
   }
   it.rows[currentLine].className = "highlight";
   $("txtkecode").value = it.rows[currentLine].cells[0].innerText.split('-')[0];
   $("txtkename").value = it.rows[currentLine].cells[0].innerText.split('-')[1];

}

//单击取值
function clickItem(clicktLine)
{
   if(document.all)
   {
      var it = document.getElementById("ice").children[0];
   }
   else
   {
      var it = document.getElementById("ice");
   }
   for(i = 0; i < it.rows.length; i ++ )
   {
      it.rows[i].className = "";
   }
   it.rows[clicktLine].className = "highlight";
   it.rows[clicktLine].cells[0].onclick = function()
   {
      $("txtkecode").value = it.rows[clicktLine].cells[0].innerText.split('-')[0];
      $("txtkename").value = it.rows[clicktLine].cells[0].innerText.split('-')[1];
      document.body.removeChild(divtable);
   }
}

//function removeDiv()
//{
//    $("txtkecode").value = it.rows[clicktLine].cells[0].innerText.split('-')[0];
//    $("txtkename").value = it.rows[clicktLine].cells[0].innerText.split('-')[1];

//    if($("contents"))
//    document.body.removeChild(divtable);
//}

页面使用

 <input type="text" id="txtkecode" name="txtkecode" οnkeyup="javascript:getSearchResult('do/Lession.aspx?daima='+this.value);"
                            style="position: absolute; top: 42px;" />