最简单的ajax例子

来源：互联网发布：java switch if 效率编辑：程序博客网时间：2024/04/29 20:39

ajax函数以及html页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">   <html xmlns="http://www.w3.org/1999/xhtml">   <head>   <title>Simple XMLHttpRequest</title>          <script type="text/javascript">   var xmlHttp;       function createXMLHttpRequest() {        if (window.ActiveXObject) {            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");        }        else if (window.XMLHttpRequest) {            xmlHttp = new XMLHttpRequest();        }    }           function startRequest() {        createXMLHttpRequest();       alert(xmlHttp);    xmlHttp.onreadystatechange = handleStateChange;        xmlHttp.open("GET", "http://localhost:8080/examples/index.jsp", true);        xmlHttp.send(null);    }           function handleStateChange() {    alert("d");    if(xmlHttp.readyState == 4) {            if(xmlHttp.status == 200) {                alert("The server replied with: " + xmlHttp.responseText);            }       }    }    </script>   </head>      <body>       <form action="#">           <input type="button" value="Start Basic Asynchronous Request" onclick="startRequest();"/>       </form>   </body>   </html>

其中http://localhost:8080/examples/index.jsp的代码如下

ajax将会获取到下面的值：<%out.println("</company>");%>

另增加一个有回调方法的ajax例子：

var xmlHttp;   /**XMLHttpRequest  */  function createXMLHttpRequest(){      if(window.XMLHttpRequest) {             xmlHttp = new XMLHttpRequest();             } else if (window.ActiveXObject) {              xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");          } else {              xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");          }        }   /**ajax 执行方法 传入要访问后台地址，该方法会将返回结果传给callback()方法*/  function executeAjax(url){        createXMLHttpRequest();      xmlHttp.abort() ;      xmlHttp.open("post",url,true);      xmlHttp.onreadystatechange = function(){        if(xmlHttp.readyState==4){             if(xmlHttp.status==200) {                 callback(xmlHttp.responseText);             }        }      };       xmlHttp.send(null);   }     function executeAjaxFun(url,fun){      createXMLHttpRequest();      xmlHttp.abort();      xmlHttp.open("post",url,true);      xmlHttp.onreadystatechange = function(){        if(xmlHttp.readyState==4){             if(xmlHttp.status==200) {                 fun(xmlHttp.responseText);             }        }      };       xmlHttp.send(null);   }

.csharpcode, .csharpcode pre{font-size: small;color: black;font-family: consolas, "Courier New", courier, monospace;background-color: #ffffff;/*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt {background-color: #f4f4f4;width: 100%;margin: 0em;}.csharpcode .lnum { color: #606060; }.csharpcode, .csharpcode pre{font-size: small;color: black;font-family: consolas, "Courier New", courier, monospace;background-color: #ffffff;/*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt {background-color: #f4f4f4;width: 100%;margin: 0em;}.csharpcode .lnum { color: #606060; }