jQuery Ajax 应用实例

最新推荐文章于 2025-08-15 22:56:20 发布

最新推荐文章于 2025-08-15 22:56:20 发布 · 43 阅读

文章标签：

#json #javascript #java #ViewUI

本文介绍了如何使用jQuery处理不同格式的数据返回，包括JSON、XML及HTML，并提供了具体的代码实例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

根据服务器端返回的数据格式的不同，分为三种情况:

1)服务器返回JSON格式的数据:

getJSON.html文件的内容如下:

已有评论

getJSON.jsp的内容如下:

2.服务器返回XML格式的数据:

getXMLData.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <link rel="stylesheet" type="text/css" href="../css/ui-lightness/jquery-ui-1.8.1.custom.css" mce_href="css/ui-lightness/jquery-ui-1.8.1.custom.css"> <mce:script type="text/javascript" src="../js/jquery.js" mce_src="js/jquery.js"></mce:script> <mce:script type="text/javascript"></mce:script> </head> <body> <form id="form1" action="#"> <p>评论:</p> <p>姓名:<input type="text" name="username" id="username"/></p> <p>内容:<textarea name="content" id="content" rows="3" cols="20">

已有评论

getXMLData.jsp:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String username = request.getParameter("username"); String content = request.getParameter("content"); response.setContentType("text/xml"); out.println("<?xml version='1.0' encoding='UTF-8' ?>"); out.println("<comments>"); out.println("<comment username='"+username+"'>"); out.println("<content>"+content+"</content>"); out.println("</comment>"); out.println("</comments>"); %>

3.服务器端返回HTML格式数据:

getHTMLData.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <link rel="stylesheet" type="text/css" href="../css/ui-lightness/jquery-ui-1.8.1.custom.css" mce_href="css/ui-lightness/jquery-ui-1.8.1.custom.css"> <mce:style></mce:style><style mce_bogus="1">* { margin:0; padding:0;} body { font-size:12px;} .comment { margin-top:10px; padding:10px; border:1px solid #ccc;background:#DDD;} .comment h6 { font-weight:700; font-size:14px;} .para { margin-top:5px; text-indent:2em;background:#DDD;}</style> <mce:script type="text/javascript" src="../js/jquery.js" mce_src="js/jquery.js"></mce:script> <mce:script type="text/javascript"></mce:script> </head> <body> <form id="form1" action="#"> <p>评论:</p> <p>姓名:<input type="text" name="username" id="username"/></p> <p>内容:<textarea name="content" id="content" rows="3" cols="20">

已有评论

getXMLData.jsp:

get方法介绍:

$.get(url [,data] [,callback] [,type]);

url:向服务器请求的资源的地址

data:异步请求时传给服务器的参数

callback:服务器返回response成功时调用的函数

type:服务器端返回的数据的格式(html,json,script,xml,text等)