1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <title>js中的Ajax經典示例</title> 6 <script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script> 7 <script type="text/javascript"> 8 9 function ajax() { 10 11 //先聲明一個異步請求對象 12 var xmlHttpReg = null; 13 if (window.ActiveXObject) {//如果是IE 14 15 xmlHttpReg = new ActiveXObject("Microsoft.XMLHTTP"); 16 17 } else if (window.XMLHttpRequest) { 18 19 xmlHttpReg = new XMLHttpRequest(); //實例化一個xmlHttpReg 20 } 21 22 //如果實例化成功,就調用open()方法,就開始准備向服務器發送請求 23 if (xmlHttpReg != null) { 24 xmlHttpReg.open("get", "About.aspx", true);1 25 xmlHttpReg.send(null); 26 xmlHttpReg.onreadystatechange = doResult; //設置回調函數 27 28 } 29 30 //回調函數 31 //一旦readyState的值改變,將會調用這個函數,readyState=4表示完成相應 32 33 //設定函數doResult() 34 function doResult() { 35 36 if (xmlHttpReg.readyState == 4) {//4代表執行完成 37 38 39 if (xmlHttpReg.status == 200) {//200代表執行成功 40 //將xmlHttpReg.responseText的值賦給ID為resText的元素 41 document.getElementById("resText").innerHTML = xmlHttpReg.responseText; 42 43 44 } 45 } 46 47 } 48 49 50 } 51 </script> 52 </head> 53 <body> 54 55 <div id="resText"></div> 56 <form method=get action=""> 57 <input type="button" value="小胡子" onclick="ajax();"/> 58 </form> 59 </body> 60 </html>