利用jQuery接受和處理xml數(shù)據(jù)的代碼(.net)
更新時(shí)間：2011年03月28日 22:11:53 作者：
以下使用jQuery+Servlet接受和處理xml數(shù)據(jù)，模擬判斷用戶名是否存在
效果如下：
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數(shù)據(jù)
*
* @author jiqinlin
*
*/
@SuppressWarnings("serial")
public class AjaxXmlServer extends HttpServlet{
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
try{
//修改一----響應(yīng)的Content-Type必須是text/xml
response.setContentType("text/xml;charset=utf-8");
PrintWriter out = response.getWriter();
//1.取參數(shù)
String old = request.getParameter("name").trim();
//修改二-----返回的數(shù)據(jù)需要拼裝成xml格式
StringBuilder builder = new StringBuilder();
builder.append("<message>");
//2.檢查參數(shù)是否有問題
if(old == null || "".equals(old)){
builder.append("用戶名不能為空").append("</message>");
} else{
//3.校驗(yàn)操作
String name = old;
if(name.equals("linjiqin")){
builder.append("用戶名[" + name + "]已經(jīng)存在，請(qǐng)使用其他用戶名").append("</message>");
} else{
builder.append("用戶名[" + name + "]尚未存在，可以使用該用戶名注冊(cè)").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>
請(qǐng)求頁面
<!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="校驗(yàn)" onclick="verify()"/>
<div id="result"></div>
<!--div和span的直觀差異，div中的內(nèi)容獨(dú)占行，span中的內(nèi)容和前后其他內(nèi)容相處良好-->
</body>
</html>
js
function verify(){
var userName = $("#userName").val();
$.ajax({
type: "POST", //http請(qǐng)求方式
url: "servlet/ajaxXmlServer", //服務(wù)器端url地址
data: "name=" + userName, //發(fā)送給服務(wù)器端的數(shù)據(jù)
dataType: "xml", //告訴JQuery返回的數(shù)據(jù)格式
success: callback //定義交互完成，并且服務(wù)器正確返回?cái)?shù)據(jù)時(shí)調(diào)用的回調(diào)函數(shù)
});
}
//回調(diào)函數(shù)
function callback(data) {
var jqueryObj = $(data);
//獲取message節(jié)點(diǎn)
var message = jqueryObj.children();
//獲取文本內(nèi)容
var text = message.text();
//4.將服務(wù)器段返回的數(shù)據(jù)動(dòng)態(tài)的顯示在頁面上
$("#result").html(text);
}
服務(wù)器端
復(fù)制代碼 代碼如下:
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數(shù)據(jù)
*
* @author jiqinlin
*
*/
@SuppressWarnings("serial")
public class AjaxXmlServer extends HttpServlet{
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
try{
//修改一----響應(yīng)的Content-Type必須是text/xml
response.setContentType("text/xml;charset=utf-8");
PrintWriter out = response.getWriter();
//1.取參數(shù)
String old = request.getParameter("name").trim();
//修改二-----返回的數(shù)據(jù)需要拼裝成xml格式
StringBuilder builder = new StringBuilder();
builder.append("<message>");
//2.檢查參數(shù)是否有問題
if(old == null || "".equals(old)){
builder.append("用戶名不能為空").append("</message>");
} else{
//3.校驗(yàn)操作
String name = old;
if(name.equals("linjiqin")){
builder.append("用戶名[" + name + "]已經(jīng)存在，請(qǐng)使用其他用戶名").append("</message>");
} else{
builder.append("用戶名[" + name + "]尚未存在，可以使用該用戶名注冊(cè)").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
復(fù)制代碼 代碼如下:
<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>
請(qǐng)求頁面
復(fù)制代碼 代碼如下:
<!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="校驗(yàn)" onclick="verify()"/>
<div id="result"></div>
<!--div和span的直觀差異，div中的內(nèi)容獨(dú)占行，span中的內(nèi)容和前后其他內(nèi)容相處良好-->
</body>
</html>
js
復(fù)制代碼 代碼如下:
function verify(){
var userName = $("#userName").val();
$.ajax({
type: "POST", //http請(qǐng)求方式
url: "servlet/ajaxXmlServer", //服務(wù)器端url地址
data: "name=" + userName, //發(fā)送給服務(wù)器端的數(shù)據(jù)
dataType: "xml", //告訴JQuery返回的數(shù)據(jù)格式
success: callback //定義交互完成，并且服務(wù)器正確返回?cái)?shù)據(jù)時(shí)調(diào)用的回調(diào)函數(shù)
});
}
//回調(diào)函數(shù)
function callback(data) {
var jqueryObj = $(data);
//獲取message節(jié)點(diǎn)
var message = jqueryObj.children();
//獲取文本內(nèi)容
var text = message.text();
//4.將服務(wù)器段返回的數(shù)據(jù)動(dòng)態(tài)的顯示在頁面上
$("#result").html(text);
}
您可能感興趣的文章:
- java+jquery處理xml數(shù)據(jù)的方法
- jquery處理json數(shù)據(jù)實(shí)例分析
- jquery序列化form表單使用ajax提交后處理返回的json數(shù)據(jù)
- jQuery處理xml格式的返回?cái)?shù)據(jù)(實(shí)例解析)
- jQuery Ajax異步處理Json數(shù)據(jù)詳解
- 詳談 Jquery Ajax異步處理Json數(shù)據(jù).
- 在jquery中處理帶有命名空間的XML數(shù)據(jù)
- jQuery jqgrid 對(duì)含特殊字符json 數(shù)據(jù)的 Java 處理方法
- jQuery getJSON 處理json數(shù)據(jù)的代碼
- jQuery常用數(shù)據(jù)處理方法小結(jié)
相關(guān)文章
這篇文章主要內(nèi)容是jQuery無刷新切換主題皮膚實(shí)例講解，本文應(yīng)用cookie記錄用戶所選擇設(shè)置的主題皮膚樣式，需要了解的朋友可以參考下2015-10-10
jQuery使用$.ajax進(jìn)行異步刷新的方法(附demo下載)
這篇文章主要介紹了jQuery使用$.ajax進(jìn)行異步刷新的方法,涉及jQuery實(shí)現(xiàn)ajax異步刷新實(shí)現(xiàn)數(shù)據(jù)交互的相關(guān)技巧,并提供了完整示例demo供讀者下載參考,需要的朋友可以參考下2015-12-12
jquery.picsign圖片標(biāo)注組件實(shí)例詳解
這篇文章主要介紹了jquery.picsign 自己封裝的第一個(gè)開源組件,需要的朋友可以參考下2018-02-02
很簡(jiǎn)單的Jquery全選功能，看代碼就明白，很實(shí)用2013-11-11![前端開發(fā)部分總結(jié)[兼容性、DOM操作、跨域等]（持續(xù)更新）](http://img.jbzj.com/images/xgimg/bcimg4.png)
前端開發(fā)部分總結(jié)[兼容性、DOM操作、跨域等]（持續(xù)更新）
在公司做這個(gè)項(xiàng)目已經(jīng)6個(gè)多月了，總結(jié)一些問題，也算是拋磚引玉吧，希望更多的朋友一起分享一些技巧。2010-03-03
把jquery 的dialog和ztree結(jié)合實(shí)現(xiàn)步驟
首先準(zhǔn)備好juqury-ui、ztree 的js文件和css 文件，接下來的步驟祥看本文希望對(duì)大家有所幫助2013-08-08
最近做項(xiàng)目做一個(gè)樹狀的下拉列表，下面小編把easyUI創(chuàng)建人員樹的實(shí)現(xiàn)代碼分享到腳本之家平臺(tái)，需要的朋友參考下吧2017-09-09
基于jquery可配置循環(huán)左右滾動(dòng)例子
基于jquery可配置循環(huán)左右滾動(dòng)例子，喜歡的朋友可以參考下。2011-09-09
本篇文章只要是對(duì)jquery ajax跨域解決方法(json方式)進(jìn)行了介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2014-02-02
jQuery實(shí)現(xiàn)的tab標(biāo)簽切換效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的tab標(biāo)簽切換效果,結(jié)合實(shí)例形式分析了jQuery響應(yīng)鼠標(biāo)事件動(dòng)態(tài)變換頁面元素屬性的相關(guān)操作技巧,需要的朋友可以參考下2016-09-09