纯Ajax实现Google Suggest功能。

<scripttype="text/javascript">
      varxmlHttpRequest;
      functioncreateXmlHttpRequest(){
          if(window.ActiveXObject){
              return newActiveXObject("Microsoft.XMLHTTP");
          }else if(window.XMLHttpRequest){
              return new XMLHttpRequest();
          }
      }
     
      functionsendData(){
         var context =document.getElementById("context");
         if(context.value.length>0 &&context.value != ""){
            varurl = '${pageContext.request.contextPath}/servlet/AjaxServlet';
            xmlHttpRequest= createXmlHttpRequest();
            xmlHttpRequest.onreadystatechange= ready;
            xmlHttpRequest.open("post",url,true);
            xmlHttpRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");
            xmlHttpRequest.send("context="+context.value);
         }
      }
     
      functionready(){
         var arr = new Array();
         var tishi =document.getElementById("tishi");
         if(xmlHttpRequest.readyState == 4 &&xmlHttpRequest.status == 200){
            var b = xmlHttpRequest.responseText;
            if(b!= null){
               repaintDIV(tishi,b);
             }
         }
      }
     
      functionrepaintDIV(tishi, b){
         tishi.style.display = "block";
         removeAllChild(tishi);
         var arr1 = b.split(" ");
         for(var i = 0; i < arr1.length; i++){
            createNodeDIV(arr1[i]);
         }
      }
     
      functionremoveAllChild(tishi){
         for(var i = 0; i <tishi.childNodes.length; i++){
            tishi.removeChild(tishi.childNodes[i]);
         }
      }
     
      functioncreateNodeDIV(obj){
         var node =document.createElement("div");
         node.style.width = 150;
         node.style.height = 10;
         node.innerHTML = obj;
         node.onmouseover = function(){
            node.style.background="gray";
         }
         node.onmouseout = function(){
            node.style.background="white";
         }
         node.style.display="block";
         document.getElementById("tishi").appendChild(node);
      }
     
      functiondiscover(){
         document.getElementById("tishi").style.display= "none";
      }



 

posted @ 2013-03-25 22:30  Pocter  阅读(209)  评论(0编辑  收藏  举报