DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> AJAX入門 >> AJAX詳解 >> WEB中基於XMLHTTP的簡單實例分析
WEB中基於XMLHTTP的簡單實例分析
編輯:AJAX詳解     
 引言
  
  大家都知道可以通過post或者get獲得form表單的數據,那麼我們如何實現不刷新的提交直接獲得頁面上的數據呢?這就要借助xmlhttp協議了。xmlhttp是XMLdom技術的一部分。
  
  下面的代碼就是一個很簡單的例子,我們利用XMLhttp技術實現簡單的用戶登陸。
  
  開始
  
  1.簡單的登錄頁面
  
  login.JSP
  function toServer(){
  var XML = "<root>"+
  "<name>"+document.all('name').value+"</name>"+
  "<pwd>"+document.all('pwd').value+"</pwd>"+
  "</root>";
  
  var XMLSender = new ActiveXObject("Microsoft.XMLHTTP" );
  XMLSender.Open("POST",'do_login.JSP',false);
  XMLSender.send((XML));
  alert(XMLSender.responseText); //可處理後台返回的結果
  }
  
  姓名:<input type="text" id="name" /><br>
  密碼:<input type="text" id="pwd" /><br>
  <input type="button" value="登錄" >
  
  2.後台的登錄處理頁面
  do_login.JSP
  
  <%
  //讀取XMLHTTP流
  Java.io.BufferedReader br = request.getReader();
  String str = "";
  while (str != null) {
  str = br.readLine();
  process (str); //可通過任何語言實現解析XML,進行業務處理
  }
  
  //返回信息
  Javax.servlet.ServletOutputStream sos = response.getOutputStream();
  sos.print("login success" );
  sos.close();
  %>
  
 

  總結
  
  與傳統的“提交-回發-重繪”式的web系統基本運行結構不同,我們可以通過通過XMLHTTP實現無刷新的客戶端直接與服務器交互,極大的提高用戶的感受度。
  
  查考資料
  
  XMLHTTP方法:
  
  Open bstrMethod, bstrUrl, varAsync, bstrUser, bstrPassWord
  bstrMethod:數據傳送方式,即GET或POST。
  bstrUrl:服務網頁的URL。
  varAsync:是否同步執行。缺省為True,即同步執行,但只能在DOM中實施同步執行。
  應用中一般將其置為False,即異步執行。
  bstrUser:用戶名,可省略。
  bstrPassWord:用戶口令,可省略。
  
  Send varBody
  varBody:指令集。可以是XML格式數據,也可以是字符串,流,或者一個無符號整數數組。也可以省略,讓指令通過Open方法的URL參數代入。
  
  setRequestHeader bstrHeader, bstrValue
  bstrHeader:HTTP 頭(header)
  bstrValue:HTTP 頭(header)的值
  如果Open方法定義為POST,可以定義表單方式上傳:
  XMLhttp.setRequestHeader "Content-Type", "application/x-www-form-urlencoded"
  
  XMLHTTP屬性:
  
  onreadystatechange:在同步執行方式下獲得返回結果的事件句柄。只能在DOM中調用。
  responseBody:結果返回為無符號整數數組。
  responseStream:結果返回為IStream流。
  responseText :結果返回為字符串。
  responseXML:結果返回為XML格式數據。
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved