学步园

 

使用js通过xmlHttpRequest向服务器请求，再根据返回的结果进行更新面页，

 

可以做到无刷新，也就是AJAX技术了。

 

项目中用到这一点，所以也就写下来，以供自己以后查询和使用。

 

1、要例用xmlHttpRequest向服务器请求，首要的就是要创建一个

 

     xmlHttpRequest对象，但这个对象会根据浏览器的不同而不同，

 

　　所以创建的时候也有区别。代码如下

 

var xmlHttp = false;</p> <p> /*@cc_on @*/<br /> /*@if (@_jscript_version >= 5)<br /> try<br /> {<br /> xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");<br /> }<br /> catch (e)<br /> {<br /> try<br /> {<br /> xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");<br /> }<br /> catch (e2)<br /> {<br /> xmlHttp = false;<br /> }<br /> }<br /> @end @*/<br /> if (!xmlHttp && typeof XMLHttpRequest != 'undefined')<br /> {<br /> xmlHttp = new XMLHttpRequest();<br /> }

 

 

　　有一点得说明，这个代码最好以静态的方式执行，也就是一开始就让页面运行这些代码以产生xmlHttpRequest

 

　　因为它可能会创建不成功，如果创建不成功的话，直接就不再执行了，以免浪费不必要的资源

 

2、创建了xmlHttpRequest对象后，就要使用它了

 

     方法如下

 

function callServer()
        {       
            xmlHttp.open("get","www.baidu.com",true);

　　　　//这是一个委托事件，也就是xmlHttpRequest请求后的结果给那个方法调用

 

            xmlHttp.onreadystatechange = updatePage;
             
            xmlHttp.send(null);
        }

 

3、请求后就要处理结果了，这个处理结果的方法就是那个委托的方法

 

       function updatePage()
        {
              if (xmlHttp.readyState == 4)
              {

 　　　　　　　var response = xmlHttp.responseText;  //这个就是请求后得到的Html源码，再根据源码处理自己要做的事

              }

        }

 

4、这里我写的不尽详细，因为我也是完成任务就行的了，下次能再次用起来就OK的那种。。。。

 

　　如果要看详细的话，请参看　http://www.ccvita.com/6.html 　这一篇文章

 

 

2010.4.29补充：

 

     1、创建xmlHttpRequest还是用比较简单的方法比较好，如下 

 

 

var req;

      

       function init()

       {

           if(window.XMLHttpRequest)

           {

              req = new XMLHttpRequest();

           }

           else if (window.ActiveXObject)

           {

              req = new ActiveXObject("Microsoft.XMLHTTP");

           }

       }

 

 

    2、 通过xmlHttpRequest请求的时候分两种，一种是POST一种是GET。这两种在传参数方面也有不同。

 

          Get的话就用简单的后面带参数的方式传过去，但POST就有点不一样了。它传参的方式是这样：

 

        

      req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  

      var c = "ID?89&Name=Love"  //就是这种形式

      req.send(c);

         

          并且要记信，req.setRequestHeader必须放在OPEN之后，也就是请求之后，否则另外一个页面是无法获取

          到参数的。至于其中的原理好像跟浏览器有关，这点没进行深入了解