jquery使ajax的开发大大的简化，做ajax的应用，前台和后台的数据传输时必然的。通常，我们可以使用普通的字符串作为前后台传输的数据（例如使用特殊字符将各个元素分隔开，在后台用split处理等等）。当传输的数据量比较大，或者数据的格式比较复杂时，我们可以考虑使用json或者xml的格式来对数据封装，传输。
jquery的ajax函数做的非常的棒，我们可以调用已经封装好的$.get(),$.post(),$.ajax()，前两个函数是最后一个函数的特殊，也就是说$.ajax（）可以让我们的ajax之旅的操控性更强。
下面是一个利用json传输的简单例子：
import org.json.*;
public class MyBean {
private String name;
private int num;
private int array[];
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public int getNum() {
return num;
}
public void setNum(int num) {
this.num = num;
}
public int[] getArray() {
return array;
}
public void setArray(int[] array) {
this.array = array;
}
public JSONObject toJson() {
JSONObject obj;
try {
obj= new JSONObject();
obj.put("name", this.name);
obj.put("num", this.num);
JSONArray array = new JSONArray(this.array);
obj.put("array", array);
} catch (Exception e) {
e.printStackTrace();
return null;
}
return obj;
}
}
只是一个简易的pojo类，用来模拟，其中有自己的toJson（）方法。需要用到org.json的包
import java.io.IOException;
import java.io.*;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class JsonServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
this.doGet(request, response);
}
@Override
protected void doPost(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
MyBean b = new MyBean();
b.setNum(22);
b.setName("andrew");
int [] array={1,2,3,4};
b.setArray(array);
String str=(String)request.getParameter("text");
System.out.println(str);
PrintWriter out=response.getWriter();
String data=b.toJson().toString();
out.print(data);
System.out.println(data);
out.flush();
}
}
接受ajax请求的servlet
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1" />
<title>Insert title here</title>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#b").click(function(){
var t=$("#text1").val()
$.post("json",{text:t},function(data){
var name=data.name;
var num=data.num;
var array=data.array;
$("#content1").html(name);
},"json");})
})
</script>
</head>
<body>
<div id="content1"></div>
<input type="text" id="text1" value="default" />
<input type="button" value="click me~" id="b" />
</body>
</html>
利用$.post()方法，传输json格式的数据，方法的最后一个参数设置接受数据默认为json
分享到：
相关推荐
**Ajax+JSON 实例详解** 在现代Web开发中，AJAX（Asynchronous JavaScript and XML）技术已经成为提升用户体验的重要工具，它允许网页在不刷新整个页面的情况下与服务器进行数据交互。结合JSON（JavaScript Object ...
综上所述，这个"asp+jquery ajax实例源码"展示了如何利用ASP作为服务器端语言处理数据，结合jQuery的AJAX功能，实现无刷新的交互体验，优化用户在添加、删除、修改和分页操作中的浏览感受。通过学习和理解这个实例，...
这个“java+ajax+json+jquery完整实例”提供了一个实际的应用场景，展示了如何将这些技术有效地结合在一起。下面，我们将详细讨论这些技术以及在这个实例中的应用。 1. **Java**：Java是一种广泛使用的面向对象的...
在这个“struts2.json.jquery简单实例”中，我们将深入理解这三个技术如何协同工作，以实现高效的数据交换和用户界面更新。 首先，Struts2是一个基于MVC（模型-视图-控制器）架构的Java框架，它简化了Java Web应用...
在本文中，我们将深入探讨如何使用jQuery AJAX与ASP.NET一起工作，通过JSON格式传递和接收数据。这非常适合初学者，因为我们将逐步解析整个过程，并提供实际的代码示例。 首先，理解jQuery AJAX的核心概念至关重要...
结合“java+json+jquery经典实例”这个标题和描述，我们可以推断这个压缩包可能包含了一些使用Java后端处理数据，通过JSON格式进行传输，并利用jQuery在前端展示和操作数据的简单示例项目。例如，它可能有一个简单的...
在现代Web开发中，前后端的数据交互是必不可少的，而Ajax和Beego框架为我们提供了高效且灵活的方式来进行这种交互，特别是在处理JSON格式的数据时。本文将深入探讨如何使用Ajax与Beego实现前后端间的JSON数据交换。 ...
JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，它基于JavaScript的一个子集，易于人阅读和编写，同时...通过实践，可以深入理解JSON数据格式、AJAX的异步特性，以及jQuery在处理AJAX请求中的便利性。
总的来说，这个C#.NET下的jQuery AJAX实例和教程将涵盖这些主题，并提供实际的代码示例和可运行的源码，帮助开发者更好地理解和应用AJAX技术。通过学习，你将能够构建出高效、用户友好的Web应用。文档`Jquery.doc`...
2. **json_java.jar**：这个文件可能提供了对Java对象和JSON之间的转换支持，帮助开发者将Java类实例转换成JSON格式，或者将接收到的JSON数据映射回Java对象。 3. **ajax_json.jar**：这个名字暗示这可能是专门为...
在这个"JqueryAjax简单实例"中，我们主要关注如何在Visual Studio 2005 C#环境下利用jQuery实现AJAX的功能。首先，我们需要确保项目中已经引入了jQuery库。这通常通过在HTML头部添加jQuery库的CDN链接或者将jQuery....
总结一下，这个"jQuery-AJAX实例"涵盖了以下几个关键知识点： 1. jQuery的$.ajax()方法，用于发起Ajax请求。 2. JSON数据格式的使用，包括Java Bean到JSON的转化。 3. jQuery如何解析服务器返回的JSON数据，并更新...
本文介绍了如何在jQuery中通过AJAX请求从后台获取JSON格式的数据，并将这些数据动态地渲染到HTML中去。具体的知识点可以分为以下几个方面： 1. jQuery的AJAX方法：在文章中，通过使用jQuery提供的$.ajax()方法来...
PHP 基于 jQuery 的 Ajax 技术传递 JSON 数据简单实例 本文主要介绍了 PHP 基于 jQuery 的 Ajax 技术传递 JSON 数据方法，以完整实例形式分析了 PHP 基于 jQuery 的 Ajax 无刷新提交数据实现方法。下面是详细的知识...
这个压缩包中的资源，"SSH+jQuery+json 实现的Ajax操作，绝对精华，代码简练清晰，绝对能看明白"，显然提供了一个使用这些技术实现Ajax级联操作的实例。下面将详细介绍这些技术及其在Ajax操作中的应用。 **SSH ...
本资源"Ajax-json.rar"显然是一份关于如何利用AJAX和JSON进行Web开发的实例教程。以下是关于这两个主题的详细讲解。 **AJAX (异步JavaScript和XML)** AJAX是一种在无需刷新整个页面的情况下，能够更新部分网页的...
**JS使用AJAX实例** AJAX（Asynchronous JavaScript and XML）是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。在JavaScript中，我们通常使用`XMLHttpRequest`对象或者jQuery库来实现AJAX请求。 1...
综上所述，"Ajax_Json_jQuery详细Demo"包含了一系列关于这三者如何协同工作的实例，对初学者来说是极好的学习资源。通过这些示例，你可以了解如何使用jQuery简化Ajax调用，以及如何处理JSON数据，从而更好地构建交互...
在本实例中，我们将探讨如何利用jQuery的AJAX功能，通过点击按钮来触发一个加载动画（通常表现为一个"loading"图标或指示器），以提升用户体验，表明后台数据正在处理中。 首先，确保在项目中引入了jQuery库。你...