jQuery form插件的使用之处理server返回的JSON， XML，HTML数据
废话不多说了，直接给大家贴代码了，具体代码如下所示：
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN">
<html>
<head>
<title>jQueryform插件的使用--处理server返回的JSON，XML，HTML数据</title>
<metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"/>
<scriptsrc="jquery-1.3.1.js"type="text/javascript"></script>
<scriptsrc="jquery.form.js"type="text/javascript"></script>
<scripttype="text/javascript">
//json
$(document).ready(function(){
$('#myForm').ajaxForm({
//声明服务器返回数据的类型.
dataType:'json',
success:processJson
});
});
functionprocessJson(data){
//'data'是一个json对象，从服务器返回的.
$('#jsonOut').html(data.name+""+data.address+""+data.comment);
}
//xml
$(document).ready(function(){
$('#xmlForm').ajaxForm({
//声明服务器返回数据的类型.
dataType:'xml',
success:processXml
});
});
functionprocessXml(responseXML){
//'responseXML'是一个XML的文档，从服务器返回的.
varname=$('name',responseXML).text();
varaddress=$('address',responseXML).text();
varcomment=$('comment',responseXML).text();
$('#xmlOut').html(name+""+address+""+comment);
}
//html
$(document).ready(function(){
$('#htmlForm').ajaxForm({
//用服务器返回的数据更新id为htmlcssrain的内容.
target:'#htmlOut',
success:function(){
$('#htmlOut').fadeIn('slow');
}
});
});
</script>
</head>
<body>
<h3>Demo8:jQueryform插件的使用--处理server返回的JSON，XML，HTML数据</h3>
<!--demo1json-->
<h4>json方式返回</h4>
<formid="myForm"action="json.jsp"method="post">
名称：<inputtype="text"name="name"id="name"/><br/>
地址：<inputtype="text"name="address"id="address"/><br/>
自我介绍：<textareaname="comment"id="comment"></textarea><br/>
<inputtype="submit"id="test"value="json方式返回"/><br/>
<divid="jsonOut"></div>
</form>
<!--demo2xml-->
<h4>xml方式返回</h4>
<formid="xmlForm"action="xml.jsp"method="post">
名称：<inputtype="text"name="xmlname"id="xmlname"/><br/>
地址：<inputtype="text"name="xmladdress"id="xmladdress"/><br/>
自我介绍：<textareaname="xmlcomment"id="xmlcomment"></textarea><br/>
<inputtype="submit"id="xmltest"value="xml方式返回"/><br/>
<divid="xmlOut"></div>
</form>
<!--demo3html-->
<h4>html方式返回</h4>
<formid="htmlForm"action="html.jsp"method="post">
名称：<inputtype="text"name="htmlname"id="htmlname"/><br/>
地址：<inputtype="text"name="htmladdress"id="htmladdress"/><br/>
自我介绍：<textareaname="htmlcomment"id="htmlcomment"></textarea><br/>
<inputtype="submit"id="htmltest"value="html方式返回"/><br/>
<divid="htmlOut"></div>
</form>
</body>
</html>
新建json.jsp文件：
<%@pagelanguage="java"import="java.util.*"pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("UTF-8");//防止乱码!
Stringname=request.getParameter("name");
Stringaddress=request.getParameter("address");
Stringcomment=request.getParameter("comment");
System.out.println(name+"-"+address+"-"+comment);
out.println("{name:'"+name+"',address:'"+address+"',comment:'"+comment+"'}");
%>
新建xml.jsp文件：
<%@pagelanguage="java"import="java.util.*"pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("UTF-8");//防止乱码!
Stringname=request.getParameter("xmlname");
Stringaddress=request.getParameter("xmladdress");
Stringcomment=request.getParameter("xmlcomment");
System.out.println(name+"-"+address+"-"+comment);
response.setContentType("text/xml");//注意，由于你是以xml形式传递过来的，所以这里必须写。
out.print("<?xmlversion=\"1.0\"encoding=\"UTF-8\"?>");
out.print("<root>");
out.print("<name>"+name+"</name>");
out.print("<address>"+address+"</address>");
out.print("<comment>"+comment+"</comment>");
out.print("</root>");
%>
新建一个html.jsp文件：
<%@pagelanguage="java"import="java.util.*"pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("UTF-8");//防止乱码!
Stringname=request.getParameter("htmlname");
Stringaddress=request.getParameter("htmladdress");
Stringcomment=request.getParameter("htmlcomment");
System.out.println(name+"-"+address+"-"+comment);
out.println("<divstyle='background-color:#ffa;padding:20px'>"+name+""+address+""+comment+"</div>");
%>
以上所述是小编给大家分享的jQueryform插件的使用之处理server返回的JSON，XML，HTML数据，希望对大家有所帮助。