1. 程式人生 > >ajax 請求資料的兩種方法

ajax 請求資料的兩種方法

實現ajax 非同步訪問網路的方法有兩個。第一個是原始的方法,第二個是利用jquery包的

原始的方法不用引入jquery包,只需在html中編寫script 片段

這裡我演示的是一個傳遞引數查詢的例子;

varurl="expert_ZFTservlet?expert_name="+"曾攀";

一.原始的方法

<script type="text/javascript">  

function load(){

   var xmlhttp;

   if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera,Safari

      xmlhttp= newXMLHttpRequest();

   }else{// code for IE6, IE5

      xmlhttp= newActiveXObject("Microsoft.XMLHTTP");

   } 

   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="+"曾攀";

   xmlhttp.open("GET", url, true);

   xmlhttp.send();

}

</script>

</head>

<body> 

<div id="myDiv">

</div>

<button type="button"

  onclick="load()" >ChangeContent</button>

</body>

二.利用jquery包的ajax請求

在使用該方法前需要引入Jquery包

   <script src="js/jquery-1.5.1.min.js" type="text/javascript"></script>

<script>

$.ajax({   

     type:'post', //方法型別  

     url:" expert_ZFTservlet?expert_name="+"曾攀",//請求地址

     dataType:'json', //資料型別

     success:callback//請求成功處理函式

     });   

//返回函式

function  callback(data){

alert(data); //獲得請求返回物件;

}

</script>

這個是我請求的servlet 的一些程式碼

expertinfolist為我的查詢結果,

為一個list<Object>型別的物件

      request.setCharacterEncoding("utf-8");

      response.setCharacterEncoding("utf-8");

      PrintWriterout=response.getWriter();

      out.print(expertinfolist);

      out.flush();

      out.close();