springMVC框架下JQuery传递并解析Json数据
json作为一种轻量级的数据交换格式，在前后台数据交换中占据着非常重要的地位。Json的语法非常简单，采用的是键值对表示形式。
JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串，然后就可以在函数之间轻松地传递这个字符串，或者在异步应用程序中将字符串从 Web 客户机传递给服务器端程序，也可以从服务器端程序传递json格式的字符串给前端并由前端解释。这个字符串是符合json语法的，而json语法又是javascript语法的子集，所以javascript很容易解释它，而且 JSON 可以表示比"名称 / 值对"更复杂的结构。下面我们通过实例来看看jQuery传递/解析json格式的数据是如何实现的。
1.首先来看前端jsp代码：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!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="/springMVC6/js/jquery-1.7.2.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
$(document).ready(function(){
//传递字符串格式json对象到后台（一个json对象）
$("#resolveJsonObject").click(function(){
var userName =encodeURI($("#userName").attr("value"));
var age = encodeURI($("#age").attr("value"));
var user = {userName:userName,age:age};
var aMenu = encodeURI(JSON.stringify(user));
$.ajax({
url:"/springMVC6/user/data/resolveJsonObject" ,
data:"orderJson=" + aMenu,
success:function(data){
}
});
});
//传递json数组到后台
$("#resolveJsonArray").click(function(){
var userName =encodeURI($("#userName").attr("value"));
var age = encodeURI($("#age").attr("value"));
//数组开始
var user1 = {userName:userName,age:age};
var allMenu={
"menu":[ ]
};
allMenu.menu.push(user1);
var allMenu1 = encodeURI(JSON.stringify(allMenu));
$.ajax({
//json数组
url:"/springMVC6/user/data/resolveJsonArray" ,
data:"orderJson=" + allMenu1,
success:function(data){
}
});
});
//接收后台的json在前台解析
$("#resolveJson").click(function(){
$.ajax({
//解析从后台返回的json数据
url:"/springMVC6/user/data/resolveJson" ,
type:"post",
success:function(data){
var arr=eval(data);
alert(arr.length);
for(var m = 0;m<arr.length;m++){
alert(arr[m].user.userName);
}
}
});
});
});
</script>
</head>
<body>
<h1>json添加用户</h1>
姓名：<input id="userName" type="text" name="userName">
年龄:<input id="age" type="text" name="age"><br>
<input type="button" id="resolveJsonObject" value="json对象">
<input type="button" id="resolveJsonArray" value="json数组">
<input type="button" id="resolveJson" value="前端解析json字符串">
</body>
</html>
2.使用javabean解析前端数据：
package com.tgb.web.controller.annotation;
import java.io.IOException;
import java.net.URLDecoder;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import com.tgb.web.controller.entity.User;
@Controller
@RequestMapping("/user/data")
public class DataController {
//接收前台传过来的字符串格式的json对象，在后台进行解析
@RequestMapping("/resolveJsonObject" )
public void resolveJsonObject(HttpServletRequest request,HttpServletResponse response) throws IOException {
//解码
String str = URLDecoder.decode(request.getParameter("orderJson"),"UTF-8");
JSONObject jb=new JSONObject();
//将json格式的字符串转换为json对象，并取得该对象的“userName”属性值
String o=(String)jb.fromObject(str).get("userName");
System.out.println(o);
}
//传递json数组字符串
@RequestMapping("/resolveJsonArray" )
public void resolveJsonArray(HttpServletRequest request,HttpServletResponse response) throws IOException {
//解码，为了解决中文乱码
String str = URLDecoder.decode(request.getParameter("orderJson"),"UTF-8");
JSONObject jb=new JSONObject();
//将json格式的字符串转换为json数组对象
JSONArray array=(JSONArray)jb.fromObject(str).get("menu");
//取得json数组中的第一个对象
JSONObject o = (JSONObject) array.get(0);//获得第一个array结果
//取出json数组中第一个对象的“userName”属性值
String name=o.get("userName").toString();//获得属性值
System.out.println(name);
}
//通过该函数返回json格式的数据，在前台通过JQuery进行解析
@RequestMapping("/resolveJson" )
public void resolveJson(HttpServletRequest request,HttpServletResponse response) throws IOException {
List m = (List) new ArrayList();
JSONArray jsons = new JSONArray();
for(int i=0;i<10;i++){
User user = new User();
user.setUserName("name_" + i);
m.add(user);
}
for(int j=0;j<m.size();j++){
JSONObject jsonObject = new JSONObject();
jsonObject.put("user", m.get(j));
jsons.add(jsonObject);
}
response.getWriter().print(jsons.toString()) ;
}
@RequestMapping("/toJson" )
public String toJson() {
return "/json";
}
}
json的作用并不仅仅在于作为字符串在前后台进行传递，我们采用json传递数据的时候更主要的考虑到的是它的传输效率。当两个系统需要进行数据交换的时候，如果传递的是经过序列化的对象，效率是非常低的，如果传递的是存储大量对象的数组的时候效率就更不敢想象了，这时如果通过将对象或数据转换成json字符串进行传递，效率就会提高很多。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
相关推荐
-
手把手教你搭建SpringMVC框架——最小化配置
为什么需要Spring MVC 最开始接触网页的时候,是纯的html/css页面,那个时候还是用Dreamweaver来绘制页面. 随着网站开发的深入,开始学习servlet开发,记得最痛苦的就是servlet返回网页的内容是字符串拼接的html页面,整不好就无法显示.... 再到后来开学学习SSH,庞大的架构眼花缭乱.Struts繁杂的标签.hibernate搞不清楚的数据表,Spring不知道哪里搞错的bean. 最后随着发展,前端开始占有一席之地,nodejs风生水起,很多业务逻辑开始前置
-
jquery.form.js框架实现文件上传功能案例解析（springmvc）
上一篇 Bootstrap自定义文件上传下载样式(http://www.jb51.net/article/85156.htm)已经有一段时间了,一直在考虑怎么样给大家提交一篇完美的逻辑处理功能.现在我结合自己的实际工作给大家分享一下. 使用的技术有jquery.form.js框架, 以及springmvc框架.主要实现异步文件上传的同时封装对象,以及一些注意事项. 功能本身是很简单的,但是涉及到一些传递参数类型的问题.例如:jquery的ajax方法与jquery.form.js中的ajaxSu
-
三步轻松搭建springMVC框架
一.搭建步骤 1.导入jar包.创建项目包结构 2.在web.xml中配置前端控制器 3.编写springMvc核心配置文件 4.编写pojo类和Controller类测试 二.实现 1.导入jar包.创建项目包结构 2.在web.xml中配置前端控制器 <!-- springMvc前端控制器 --> <servlet> <servlet-name>springMvc</servlet-name> <servlet-class>org.sprin
-
JavaWeb开发之Spring+SpringMVC+MyBatis+SpringSecurity+EhCache+JCaptcha 完整Web基础框架
简单介绍一下,本框架的基本功能点: Spring:整个框架的主体部分,这个自不用说. SpringMVC:MVC部分我还是比较喜欢Spring的. MyBatis:选型的时候选择这个ORM主要也是考虑其灵活性的问题,毕竟我也不知道,今后会遇到怎样的需求,用Hibernate一来是不太会用,二来,我还是比较喜欢直接写SQL来的简单一点. SpringSecurity:这个主要是安全框架,负责用户登录验证及整站权限分配的相关事项(权限分配真的很有用,这个我就不多说了). EhCache:一个非常流行
-
Java框架篇：Spring+SpringMVC+hibernate整合开发
前言: 最近没什么事做,搭个框架写成博客记录下来,拉通一下之前所学知识. 话不多说,我们直接步入正题. 准备工作: 1/安装并配置java运行环境 2/数据库的安装配置(Mysql) 3/安装并配置服务器(Tomcat) 4/Maven 5/ IntelliJIDEA的安装配置(本人使用的主要软件是IntelliJIDEA,没用eclipse什么的) 6/ 使用IntelliJIDEA创建一个web app项目. 貌似就这些了吧 导包 不同于以往的导包,由于我们创建的是maven的webapp项
-
详解Spring框架之基于Restful风格实现的SpringMVC
如果说现在你要做一个系统,假设说有一个模块属于公告管理,那么我们可能安排路径的时候会这样安排NewsAction路径: 增加新闻:/pages/back/admin/news/add.action: 新闻列表:/pages/back/admin/news/list.action 随着技术的发展,有一种新型的架构设计思想:Restful风格,也就是说利用一个简单的路径,而后根据HTTP提交模式不同.那么可以完成不同的功能,也就是说: 看一个新闻内容:/news/1,GET: 删除新闻:/news/
-
详解SpringMVC和MyBatis框架开发环境搭建和简单实用
1.下载SpringMVC框架架包,下载地址: 点击下载 点击打开地址如图所示,点击下载即可 然后把相关的jar复制到lib下导入 2.MyBatis(3.4.2)下载 点击下载 MyBatis中文文档地址 点击查看 下载解压之后把jar复制到lib下导入,大概是这样子的 3.jdbc连接库还没有下载...这个是5.1.41版本的... 点击下载 解压之后这样子... 4.fastjson 阿里巴巴的json解析库 点击下载 版本是1.2.24 这个是托管到了github上面的,地址是:点击进入
-
使用jQuery.form.js/springmvc框架实现文件上传功能
使用的技术有jquery.form.js框架, 以及springmvc框架.主要实现异步文件上传的同时封装对象,以及一些注意事项. 功能本身是很简单的,但是涉及到一些传递参数类型的问题.例如:jquery的ajax方法与jquery.form.js中的ajaxSubmit方法的参数,具体细节将在下一篇博客中分享. 重点: html表格三要素: action="fileUpload/fileUpload" method="post" enctype="mul
-
在SpringMVC框架下实现文件的上传和下载示例
在eclipse中的javaEE环境下:导入必要的架包 web.xml的配置文件: <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation=&
-
详解SpringMVC验证框架Validation特殊用法
基本用法不说了,网上例子很多,这里主要介绍下比较特殊情况下使用的方法. 1. 分组 有的时候,我们对一个实体类需要有多中验证方式,在不同的情况下使用不同验证方式,比如说对于一个实体类来的id来说,保存的时候是不需要的,对于更新时是必须的,可以如下配置: public class UserModel { @NotNull(message = "{id.empty}", groups = { First.class }) private int id; @NotNull(message =