这两天学的东西有点多,今天抽个时间写下来,以此作为激励,这两天学了json,ajax,jQuery
一、使用第三方的工具java转换为json类型
首先就是java类型转换为json对象,首先要导入第三方工具包:
准备导入第三方jar包:
》commons-beanutils-1.7.0.jar
》commons-collections-3.1.jar
》commons-lang-2.5.jar
》commons-logging-1.1.1.jar
》ezmorph-1.0.3.jar
》json-lib-2.1-jdk15.jar
转换的方法如下:
(1)JavaBean----->JSON
》JSONArray jsonArray = JSONArray.fromObject(city);
》String jsonJAVA = jsonArray.toString();
(2)List----->JSON
》JSONArray jsonArray = JSONArray.fromObject(cityList);
》String jsonJAVA = jsonArray.toString();
(3)List----->JSON
》JSONArray jsonArray = JSONArray.fromObject(stringList);
》String jsonJAVA = jsonArray.toString();
(4)Set----->JSON
》JSONArray jsonArray = JSONArray.fromObject(citySet);
》String jsonJAVA = jsonArray.toString();
(5)Map----->JSON
》JSONArray jsonArray = JSONArray.fromObject(map);
》String jsonJAVA = jsonArray.toString();
public static voidjavabean2Json()
{
City city= new City(1,"广州");
JSONArray jsonArray=JSONArray.fromObject(city);
String jsonJAVA=jsonArray.toString();
System.out.println(jsonJAVA);//[{"id":1,"name":"广州"}]
}public static voidlist2json()
{
List cityList = new ArrayList();
cityList.add(new City(1,"广州"));
cityList.add(new City(2,"深圳"));
Province province= new Province(1,"广东",cityList);//[{"id":1,"cityList":[{"id":1,"name":"广州"},{"id":2,"name":"深圳"}],"name":"广东"}]
JSONArray jsonArray =JSONArray.fromObject(province);
String jsonJAVA=jsonArray.toString();
System.out.println(jsonJAVA);//List集合[{"id":1,"name":"广州"},{"id":2,"name":"深圳"}]
}public static voidset2json()
{
Set citySet= new HashSet();
citySet.add(new City(1,"广州"));
citySet.add(new City(2,"深圳"));
JSONArray jsonArray=JSONArray.fromObject(citySet);
String jsonJAVA=jsonArray.toString();
System.out.println(jsonJAVA);//[{"id":1,"name":"广州"},{"id":2,"name":"深圳"}]
}public static voidmap2json()
{
List cityList = new ArrayList();
cityList.add(new City(1,"广州"));
cityList.add(new City(2,"深圳"));
Map map = new HashMap();
map.put("total", cityList.size());//表示集合的长度
map.put("rows", cityList);//表示集合
/*** [{"total":2,"rows":[{"id":1,"name":"广州"},{"id":2,"name":"深圳"}]}]*/JSONArray jsonArray=JSONArray.fromObject(map);
String jsonJAVA=jsonArray.toString();
jsonJAVA= jsonJAVA.substring(1,jsonJAVA.length()-1);
System.out.println(jsonJAVA);//[{"id":1,"name":"广州"},{"id":2,"name":"深圳"}]
}public static voidmain(String[] args) {//TODO Auto-generated method stub//javabean2Json();//list2json();//set2json();
map2json();
}
注意的是这里json全是java格式,必须转换为javascript所支持的json格式.
注意:JS可以直接解析JSON格式的文本,前提是:该JSON必须采用JS格式书写的才行,如果该JSON是采用Java格式写的,必须使用eval()函数转换后,方可被JS解析,该eval("")函数接收一个字符串格式的内容。
二 、使用struts2自动将java对象转换为json
1)导入struts2的jar包,主要是一些核心包,
commons-fileupload-1.2.2.jar
commons-io-2.0.1.jar
commons-lang3-3.1.jar
freemarker-2.3.19.jar
javassist-3.11.0.GA.jar
ognl-3.0.5.jar
struts2-core-2.3.4.1.jar
xwork-core-2.3.4.1.jar
还有一个struts2对json支持的插件包:struts2-json-plugin-2.3.1.1.jar
2)配置web.xml
struts2
org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter
struts2
/*
配置struts.xml文件
/p>
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts-2.3.dtd">
3)javabean 代码:
packagecn.itcast.js_02.provincecityarea;public classBean {privateString province;privateString city;publicBean() {//TODO Auto-generated constructor stub
}publicString getProvince() {returnprovince;
}public voidsetProvince(String province) {this.province =province;
}publicString getCity() {returncity;
}public voidsetCity(String city) {this.city =city;
}
}
Action代码:
packagecn.itcast.js_02.provincecityarea;importjava.util.ArrayList;importjava.util.List;importcom.opensymphony.xwork2.ActionSupport;public class ProvinceCityArea extendsActionSupport {privateBean bean;public voidsetBean(Bean bean) {this.bean =bean;
}publicBean getBean() {returnbean;
}public String findCityByProvince() throwsException {//TODO Auto-generated method stub
cityList = new ArrayList();if("湖北".equals(bean.getProvince()))
{
cityList.add("武汉");
cityList.add("孝感");
cityList.add("黄冈");
}else if("湖南".equals(bean.getProvince()))
{
cityList.add("长沙");
cityList.add("株洲");
cityList.add("岳阳");
cityList.add("湖南");
}else if("江西".equals(bean.getProvince()))
{
cityList.add("南昌");
cityList.add("南昌");
cityList.add("南昌");
cityList.add("南昌");
}//配置让struts2自动将List/Set/Map转换为JSON文本
return this.SUCCESS;
}/*** 通过城市查找区域
*@return*@throwsException*/
public String findAreaByCity() throwsException {//TODO Auto-generated method stub
areaList = new ArrayList();if("武汉".equals(bean.getCity()))
{
areaList.add("AA");
areaList.add("BB");
areaList.add("CC");
}else if("南昌".equals(bean.getCity()))
{
areaList.add("DD");
areaList.add("EE");
areaList.add("FF");
}else if("长沙".equals(bean.getCity()))
{
areaList.add("GG");
areaList.add("HH");
areaList.add("II");
}//配置让struts2自动将List/Set/Map转换为JSON文本
return this.SUCCESS;
}private ListcityList;private ListareaList;public ListgetAreaList() {returnareaList;
}public ListgetCityList()
{return this.cityList;
}
}
jsp代码:
Stringpath=request.getContextPath();StringbasePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%>
">
struts2实现三级联查询请选择省份
湖北
湖南
江西
请选择城市
请选择区域
document.getElementById("provinceID").οnchange= function()
{varprovince= this[this.selectedIndex].innerHTML;//清除之前的样式
varcityElement=document.getElementById("cityID");
cityElement.options.length= 1;//当省份发生变化时,区域也会发生变化
varareaElement=document.getElementById("areaID");
areaElement.options.length= 1;if("选择省份"!=province)
{//NO1)
varajax=createAjax();//NO2)
varmethod= "POST";varurl= "${pageContext.request.contextPath}/findCityByProvince?time="+newDate().getTime();
ajax.open(method, url);//NO3)
ajax.setRequestHeader("content-type","application/x-www-form-urlencoded");//NO4)
varcontent= "bean.province="+province;
ajax.send(content);//------------------------->等待
//NO5)
ajax.onreadystatechange= function()
{if(ajax.readyState== 4)
{if(ajax.status== 200)
{//NO6)返回JAVA
varjsonJAVA=ajax.responseText;varp=eval("("+jsonJAVA+")");vararray=p.cityList;varsize=array.length;for(vari=0;i
{varcity=array[i];varoption=document.createElement("option");
option.innerHTML=city;
cityElement.appendChild(option);
}
}
}
}
}
}
document.getElementById("cityID").οnchange= function()
{varcity= this[this.selectedIndex].innerHTML;//清除之前的数据
varareaElement=document.getElementById("areaID");
areaElement.options.length= 1;if("请选择城市"!=city)
{//NO1)
varajax=createAjax();//MO2)
varmethod= "POST";varurl= "${pageContext.request.contextPath}/findAreaByCity?time="+newDate().getTime();
ajax.open(method,url);//NO3)
ajax.setRequestHeader("content-type","application/x-www-form-urlencoded");//NO4)
varcontent= "bean.city="+city;
ajax.send(content);//----------------------等待
ajax.onreadystatechange= function()
{//NO5)
if(ajax.readyState== 4)
{if(ajax.status== 200)
{//NO6)
varjsonJAVA=ajax.responseText;varjsonJS=eval("("+jsonJAVA+")");vararray=jsonJS.areaList;varsize=array.length;for(vari=0;i
{vararea=array[i];varoption=document.createElement("option");
option.innerHTML=area;
areaElement.appendChild(option);
}
}
}
}
}
}
在这中间出了一些问题,大部分是因为写错了方法名称或属性名例如:ajax.onreadystatechange
最后再附上源码地址:https://github.com/blench/js_day02.git