Ajax 由 HTML、JavaScript 技术、DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。对于Ajax,最核心的一个对象是XMLHttpReque......
functiongetInfo(){ varnum=document.getElementById("num").value;//获得表单的数据 varurl="/ajax/1.php?n=" escape(num); xmlHttp.open("GET",url,true);//这里的true代表是异步请求 xmlHttp.onreadystatechange=updatePage; xmlHttp.send(null); } 我们还需要在html里面来触发这个函数: <inputname="num"id="num"onblur="getInfo()"type="text"/> 下面我们需要来编写updatePage()这个函数:
functionupdatePage(){ if(xmlhttp.readyState==4){ varresponse=xmlhttp.responseText; document.getElementById("city").value=response; } } 上面这段代码里面的readyState是服务器返回的一个状态,4这个状态表示请求已经发送,并处理完毕。responseText是获得服务器返回的信息,然后通过javascript赋给ID为city的表单。 到此,一个简单的Ajax程序就完成了,完整的javascript代码如下:
varxmlHttp=false; try{ xmlHttp=newXMLHttpRequest(); }catch(trymicrosoft){ try{ xmlHttp=newActiveXObject("Msxml2.XMLHTTP"); }catch(othermicrosoft){ try{ xmlHttp=newActiveXObject("Microsoft.XMLHTTP"); }catch(failed){ xmlHttp=false; } } } if(!xmlHttp){ alert("无法创建 XMLHttpRequest 对象!"); } functiongetInfo(){ varnum=document.getElementById("num").value;//获得表单的数据 varurl="/ajax/1.php?n=" escape(num); xmlHttp.open("GET",url,true);//这里的true代表是异步请求 xmlHttp.onreadystatechange=updatePage; xmlHttp.send(null); } functionupdatePage(){ if(xmlhttp.readyState==4){ varresponse=xmlhttp.responseText; document.getElementById("city").value=response; } } 这里还缺一个php文件,由于处理的方式不一样,写法也不一样,而且这不是Ajax的主要部分,所以这里就不放代码了。只要记住php是输出并返回所需要的数据就可以了
好久没更新,今天看到这教程,对初学者挺适合.
2/2 首页 上一页 1 2 |