JavaWeb开发中Ajax技术、json与java实现List、Map数据直接传递的研究
一、在JavaWeb开发中基于jquery框架来使用ajax技术，Json与后台servlet进行数据交互示例,下面示例中基于servlet技术，没有使用struts2等框架。
由于项目需要通过ajax得到后台的List对象、map对象里面的值，闲暇时间摸索了一下关于json接受List对象的方法，步骤如下：
1.首先下载json所以依赖的包， Json-lib 最新版json-lib-2.3-jdk15.jar，其官方网站是：http://json-lib.sourceforge.net/可以直接download，细心的你会发现其网站页面里面有提示它还需要其他包：
Json-lib requires(at least) the following dependencies in your classpath:
•jakartacommons-lang 2.4
•jakartacommons-beanutils 1.7.0
•jakartacommons-collections 3.2
•jakartacommons-logging 1.1.1
•ezmorph 1.0.6
下载地址分别是：
http://commons.apache.org/lang/
http://commons.apache.org/beanutils/
http://commons.apache.org/collections/
http://commons.apache.org/logging/
http://ezmorph.sourceforge.net/
2.首先先见一个小web项目
先建一个User类：
[java] view plaincopy
package com.json;
public class User {
String username;
String password;
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
再建一个servlet 程序：
[java] view plaincopy
package com.json;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
public class TestJson extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request,response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
String str= request.getParameter("name");//得到ajax传递过来的paramater
System.out.print(str);
PrintWriter out = response.getWriter();
List list = new ArrayList();//传递List
Map m=new HashMap();//传递Map
User u1=new User();
u1.setUsername("zah");
u1.setPassword("123");
User u2=new User();
u2.setUsername("ztf");
u2.setPassword("456");
list.add(u1); //添加User对象
list.add(u2); //添加User对象
m.put("u1", u1);
m.put("u2", u2);
JSONArray jsonArray2 = JSONArray.fromObject( list );
//把list转化成转化成json对象
JSONObject jo=JSONObject.fromObject(m);//转化Map对象为Json对象
out.print(jsonArray2);//返给ajax请求
out.print(jo);//返给ajax请求
}
}
配置好web.xml中的servlet映射，这一步就略了。
3.建立ajax实现 （这里为了快速实现用的是jquery实现的）
[html] view plaincopy
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
function test(){
$.ajax({
type:"POST", //请求方式
url:"testjson", //请求路径：${base}/类所在的命名空间/类名（配置文件中执行对应类的那个name），命名空间是在配置文件中定义。
cache: false,
data:"name=zah", //传参
dataType: 'json', //返回值类型
success:function(json){
alert(json[0].username+" " json[0].password); //弹出返回过来的List对象
}
});
}
</script>
</head>
<body>
<input type="button" name="b" value="测试" οnclick=test()>
</body>
测试开始，点击按钮弹出zah 123
json[0]就相当于u1对象 json[1]相当于u2对象，对于其属性的访问跟java对象一样，其他的Connection测试应该一样,访问Map的话直接把返回函数改成如下即可：
[javascript] view plaincopy
success:function(json){
alert(json.u1.username)
}
直接跟上Key.属性即可访问Object对象。
一、在JavaWeb开发中基于jquery框架来使用ajax技术，Json与后台servlet进行数据交互示例,下面示例中基于servlet技术，没有使用struts2等框架。
由于项目需要通过ajax得到后台的List对象、map对象里面的值，闲暇时间摸索了一下关于json接受List对象的方法，步骤如下：
1.首先下载json所以依赖的包， Json-lib 最新版json-lib-2.3-jdk15.jar，其官方网站是：http://json-lib.sourceforge.net/可以直接download，细心的你会发现其网站页面里面有提示它还需要其他包：
Json-lib requires(at least) the following dependencies in your classpath:
•jakartacommons-lang 2.4
•jakartacommons-beanutils 1.7.0
•jakartacommons-collections 3.2
•jakartacommons-logging 1.1.1
•ezmorph 1.0.6
下载地址分别是：
http://commons.apache.org/lang/
http://commons.apache.org/beanutils/
http://commons.apache.org/collections/
http://commons.apache.org/logging/
http://ezmorph.sourceforge.net/
2.首先先见一个小web项目
先建一个User类：
[java] view plaincopy
package com.json;
public class User {
String username;
String password;
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
再建一个servlet 程序：
[java] view plaincopy
package com.json;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
public class TestJson extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request,response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
String str= request.getParameter("name");//得到ajax传递过来的paramater
System.out.print(str);
PrintWriter out = response.getWriter();
List list = new ArrayList();//传递List
Map m=new HashMap();//传递Map
User u1=new User();
u1.setUsername("zah");
u1.setPassword("123");
User u2=new User();
u2.setUsername("ztf");
u2.setPassword("456");
list.add(u1); //添加User对象
list.add(u2); //添加User对象
m.put("u1", u1);
m.put("u2", u2);
JSONArray jsonArray2 = JSONArray.fromObject( list );
//把list转化成转化成json对象
JSONObject jo=JSONObject.fromObject(m);//转化Map对象为Json对象
out.print(jsonArray2);//返给ajax请求
out.print(jo);//返给ajax请求
}
}
配置好web.xml中的servlet映射，这一步就略了。
3.建立ajax实现 （这里为了快速实现用的是jquery实现的）
[html] view plaincopy
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
function test(){
$.ajax({
type:"POST", //请求方式
url:"testjson", //请求路径：${base}/类所在的命名空间/类名（配置文件中执行对应类的那个name），命名空间是在配置文件中定义。
cache: false,
data:"name=zah", //传参
dataType: 'json', //返回值类型
success:function(json){
alert(json[0].username+" " json[0].password); //弹出返回过来的List对象
}
});
}
</script>
</head>
<body>
<input type="button" name="b" value="测试" οnclick=test()>
</body>
测试开始，点击按钮弹出zah 123
json[0]就相当于u1对象 json[1]相当于u2对象，对于其属性的访问跟java对象一样，其他的Connection测试应该一样,访问Map的话直接把返回函数改成如下即可：
[javascript] view plaincopy
success:function(json){
alert(json.u1.username)
}
直接跟上Key.属性即可访问Object对象。
464
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
