在Java後端專案的開發過程中，由於涉及前端相關的東西，會經常遇到ajax請求的形式，學習一下，可以在開發後端的過程中更加的流暢。

ajax：Asynchronous JavaScript and XML

1、原始方法請求

function load(){
   var xmlhttp;
 //建立XMLHttpRequest物件
   if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera,Safari
      xmlhttp= newXMLHttpRequest();
   }else{// code for IE6, IE5
      xmlhttp= newActiveXObject("Microsoft.XMLHTTP");
   } 
 //設定回撥函式
 //onreadystatechange 事件被觸發 5 次（0 - 4），對應著 readyState 的每個變化。
   xmlhttp.onreadystatechange= function(){
   
      if (xmlhttp.readyState ==4 && xmlhttp.status == 200) {//獲得了請求資料
 var expertinfolist = xmlhttp.responseText;
   //傳送請求資料到myDiv     document.getElementById("myDiv").innerHTML=expertinfolist;              
      }
   }
   var url="expert_ZFTservlet?expert_name="+"tom";
   //建立連線
   xmlhttp.open("GET", url,true);
  //傳送請求
   xmlhttp.send();
}
 

2  利用jQuery的請求

$.ajax({   
     type:'post',//方法型別  
     url:" expert_ZFTservlet?expert_name="+"曾攀",//請求地址     
     dataType:'json',//資料型別 
     data:{page:page},//請求到介面的物件
     success:callback//請求成功處理函式  
     });   
//返回函式
function  callback(data){
alert(data); //獲得請求返回物件；
}

三.通過遠端 HTTP GET 請求載入資訊。

這是一個簡單的 GET 請求功能以取代複雜 $.ajax 。請求成功時可呼叫回撥函式。如果需要在出錯時執行函式，請使用 $.ajax。

$.get("test.cgi", { name: "John", time: "2pm" },
  function(data){
    alert("Data Loaded: " + data);
  });

四. 通過遠端 HTTP POST 請求載入資訊。
這是一個簡單的 POST 請求功能以取代複雜 $.ajax 。請求成功時可呼叫回撥函式。如果需要在出錯時執行函式，請使用 $.ajax。

$.post("/Resources/addfriend.ashx", { "fid": fids, "fname": fnames, "tuid": tuids, "tuname": tunames }, function (data) {
        if (data == "ok") {
            alert("新增成功！");
        }
    })
 

五.通過 HTTP GET 請求載入 JSON 資料。
 

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?",
function(data){
  $.each(data.items, function(i,item){
    $("<img/>").attr("src", item.media.m).appendTo("#images");
    if ( i == 3 ) return false;
  });
});