利用jQuery接受和處理xml數據的代碼(.net)

更新時間：2011年03月28日 22:11:53 作者：

以下使用jQuery+Servlet接受和處理xml數據，模擬判斷用戶名是否存在

效果如下：

服務器端

 
package com.ljq.test; 
import javax.servlet.http.HttpServlet; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 
import javax.servlet.ServletException; 
import java.io.IOException; 
import java.io.PrintWriter; 
/** 
* 利用jQuery接受和處理xml數據 
* 
* @author jiqinlin 
* 
*/ 
@SuppressWarnings("serial") 
public class AjaxXmlServer extends HttpServlet{ 
protected void doGet(HttpServletRequest request, 
HttpServletResponse response) throws ServletException, IOException { 
try{ 
//修改一----響應的Content-Type必須是text/xml 
response.setContentType("text/xml;charset=utf-8"); 
PrintWriter out = response.getWriter(); 
//1.取參數 
String old = request.getParameter("name").trim(); 
//修改二-----返回的數據需要拼裝成xml格式 
StringBuilder builder = new StringBuilder(); 
builder.append("<message>"); 
//2.檢查參數是否有問題 
if(old == null || "".equals(old)){ 
builder.append("用戶名不能為空").append("</message>"); 
} else{ 
//3.校驗操作 
String name = old; 
if(name.equals("linjiqin")){ 
builder.append("用戶名[" + name + "]已經存在，請使用其他用戶名").append("</message>"); 
} else{ 
builder.append("用戶名[" + name + "]尚未存在，可以使用該用戶名注冊").append("</message>"); 
} 
out.println(builder.toString()); 
System.out.println(builder.toString()); 
} 
} catch(Exception e){ 
e.printStackTrace(); 
} 
} 
protected void doPost(HttpServletRequest request, 
HttpServletResponse response) throws ServletException, IOException { 
doGet(request, response); 
} 
} 

修改web.xml

復制代碼代碼如下:

 
<servlet> 
<servlet-name>AjaxXmlServer</servlet-name> 
<servlet-class>com.ljq.test.AjaxXmlServer</servlet-class> 
</servlet> 
<servlet-mapping> 
<servlet-name>AjaxXmlServer</servlet-name> 
<url-pattern>/servlet/ajaxXmlServer</url-pattern> 
</servlet-mapping> 

請求頁面

復制代碼代碼如下:

 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<script type="text/javascript" src="http://localhost:8083/jqueryprj/js/jquery-1.3.1.js"></script> 
<script type="text/javascript" src="http://localhost:8083/jqueryprj/js/verifyjqueryxml.js"></script> 
</head> 
<body> 
<input type="text" id="userName" /> 
<input type="button" value="校驗" onclick="verify()"/> 
<div id="result"></div> 
<!--div和span的直觀差異，div中的內容獨占行，span中的內容和前后其他內容相處良好--> 
</body> 
</html> 

js

復制代碼代碼如下:

 
function verify(){ 
var userName = $("#userName").val(); 
$.ajax({ 
type: "POST", //http請求方式 
url: "servlet/ajaxXmlServer", //服務器端url地址 
data: "name=" + userName, //發(fā)送給服務器端的數據 
dataType: "xml", //告訴JQuery返回的數據格式 
success: callback //定義交互完成，并且服務器正確返回數據時調用的回調函數 
}); 
} 
//回調函數 
function callback(data) { 
var jqueryObj = $(data); 
//獲取message節(jié)點 
var message = jqueryObj.children(); 
//獲取文本內容 
var text = message.text(); 
//4.將服務器段返回的數據動態(tài)的顯示在頁面上 
$("#result").html(text); 
} 