jQuery中ajax的使用
阿新 • • 發佈：2018-12-11
java 下常見的json類庫都有Gson，JSON_lib 和 jackson等，但 jackson相對來說比較高效，在專案中主要也是使用jackson進行json和Java物件轉換；
那麼什麼是jackson呢 ？
1）：Jackson是一個簡單基於Java應用庫，Jackson可以輕鬆的將Java物件轉換成json物件 和xml文件，同樣也可以將json、xml轉換成Java物件
1.1）：Java物件轉成json字串
package com.damei.entity; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterxml.jackson.databind.ObjectMapper; public class Temp1 { public static void main(String[] args) throws JsonProcessingException { /* * ObjectMapper類是Jackson庫的主要類。它提供一些功能將轉換成Java物件匹配JSON結構， */ ObjectMapper oMapper = new ObjectMapper(); //json物件 Student student1 = new Student("s001","黃"); Student student2 = new Student("s002","黃圓"); /* * oMapper.writeValueAsString將Java物件轉成json字串 */ System.out.println(oMapper.writeValueAsString(student1)); //json陣列 List<Student> listStu = new ArrayList<Student>(); listStu.add(student1); listStu.add(student2); String writeValueAsString = oMapper.writeValueAsString(listStu); System.out.println(writeValueAsString); //json混合 Map<String, Object> map = new HashMap<>(); map.put("hello",6); map.put("studentS", listStu); String writeValueAsString2 = oMapper.writeValueAsString(map); System.out.println(writeValueAsString2); } }
1.2）：javaBean 與 map 集合轉換成json字串是一樣的
package com.damei.entity; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterxml.jackson.databind.ObjectMapper; /** * javaBean 與 map 集合轉換成json字串是一樣的 * @author Administrator * */ public class Temp3 { public static void main(String[] args) throws JsonProcessingException { //物件 Map<String, Object> map1 = new HashMap<>(); map1.put("sid","s001"); map1.put("sname", "胡"); ObjectMapper mapper = new ObjectMapper(); System.out.println(mapper.writeValueAsString(map1)); Map<String, Object> map2 = new HashMap<>(); map2.put("sid","s002"); map2.put("sname", "胡2"); //陣列 List<Map<String,Object>> list1 = new ArrayList<>(); list1.add(map1); list1.add(map2); System.out.println(mapper.writeValueAsString(list1)); //混合 Map<String, Object> map3 = new HashMap<>(); map3.put("hello", 521); map3.put("Student", list1); System.out.println(mapper.writeValueAsString(map3)); } }
1.3）：講解 json 雙向綁值 死迴圈
package com.damei.entity; import java.util.HashSet; import java.util.Set; import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterxml.jackson.databind.ObjectMapper; /** * 講解 json 雙向綁值 死迴圈 * @author Administrator * */ public class Temp2 { public static void main(String[] args) throws JsonProcessingException { Student student1 = new Student("s001","胡"); Student student2 = new Student("s002","H Y Y"); Teacher teacher1 = new Teacher("t001", "嗯哈1", null); Teacher teacher2 = new Teacher("t002", "嗯哼2", null); Set<Teacher> teachers = new HashSet<>(); teachers.add(teacher1); teachers.add(teacher2); student1.setSetT(teachers); //一個學生裝著兩個老師 Set<Student> students = new HashSet<>(); students.add(student1); students.add(student2); teacher2.setSetS(students); //一個老師裡有兩個學生（兩邊互相呼叫會進行死迴圈） ObjectMapper oMapper = new ObjectMapper(); System.out.println(oMapper.writeValueAsString(student1)); //輸出時出現死迴圈問題 } }
解決方案： 1）： 將雙向繫結改成單向繫結 （將彼此之間的關係交予一方維護）
2）：用 @JsonIgnore/程式控制一個屬性
jQuery的ajax請求（與後臺進行互動)
首先我們寫一個JsonBasedao來寫那個dao方法 一個查詢方法 然後在dao方法繼承JsonBasedao 來進行對應的SQL語句處理 再通過servlet配置呼叫 之後就通過jsp頁面訪問
public List<Map<String, Object>> foreach(ResultSet rs) throws InstantiationException, IllegalAccessException, SecurityException, IllegalArgumentException, SQLException{
/*
* 建立一個實體類的實列
* 給建立的實體類屬性賦值
* 將新增完成的實體類加到list集合裡面去
*/
List<Map<String, Object>> list=new ArrayList<>();
//獲取原資料
ResultSetMetaData metaData = rs.getMetaData();
//獲取列
int columnCount = metaData.getColumnCount();
Map<String, Object> map = null;
while(rs.next()) {
map = new HashMap<>();
for (int i = 1; i < columnCount; i++) {
//拿到 資料庫裡面每個列名下的不同值
map.put(metaData.getColumnName(i), rs.getObject(i));
}
//將map集合裡面的值加到list容器裡去
list.add(map);
}
//返回list
return list;
}public class JsonUtitls {
/** 用來處理json資料
* 在這裡面拿到我們所需要用到的查詢維度 用於sql語句拼接
* @param pareMap 獲取從jsp頁面傳遞到後臺的引數集合
* @param key 值
* @return
*/
public static String getPareMap(Map<String,String[]> pareMap,String key) {
if(pareMap != null && pareMap.size()>0) {
String[] values = pareMap.get(key);
if(values != null && values.length>0) {
String value = Arrays.toString(values);
return value.substring(1, value.length()-1);
}
return "";
}
return "";
}
public class RegionDao extends RegionBaesDao{
/**
* 用來查詢方法
* @throws SQLException
* @throws InstantiationException
* @throws IllegalAccessException
* @throws IllegalArgumentException
*/
public List<Map<String, Object>> findAll(Map<String,String[]> pareMap,PageBean pageBean) throws IllegalArgumentException, IllegalAccessException, InstantiationException, SQLException{
String id = JsonUtitls.getPareMap(pareMap, "ID");
String sql = "select * from ch_region where true";
if(StringUtils.isBlank(id)) {
sql += " and parent_id=7459";
}else {
sql += " and parent_id="+id;
}
return super.ExecuteQuery(sql, null);
}
jsp頁面可直接呼叫自己寫的js裡面Ajax程式碼就能直接獲取
自己寫的一個function程式入口 然後呼叫Ajax直接去掉那個url重新整理 當點選一個值會進行區域性重新整理
<%@ 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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="${pageContext.request.contextPath}/easy/jquery.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/easy/ajax.js"></script>
<title>Insert title here</title>
</head>
<body>
<div>
<!-- 傳一個全限類名id過去 -->
<input type="hidden" id="ctx" value="${pageContext.request.contextPath}"/>
<div>
收貨地址
<select id="province">
<option selected="selected">---請選擇省份---</option>
</select>
<select id="city">
<option selected="selected">---請選擇城市---</option>
</select>
<select id="county">
<option selected="selected">---請選擇縣區---</option>
</select>
</div>
</div>
</body>
</html>$(function(){
var c = $("#ctx").val(); //獲取頁面傳過來的隱藏id
$.ajax({
url:c+"/regionServlet", //獲取到servlet裡面方法物件
success:function(data){ //請求成功後的回撥函式
for(index in data){ //遍歷每一個值
// console.log(data[index]);
$("#province ").append("<option value='"+data[index].ID+"'>"+data[index].REGION_NAME+"</option>");
}
},
dataType:"json" //把型別變成json型別物件object
});
$("#province").change(function(){ //獲取省份的id並且加上change事件
$("option:gt(0)","#city").remove(); //當執行改變他的值的時候其他的要清空上次的內容 不然會疊加
$("option:gt(0)","#county").remove(); //屬於這個option裡第一位後面的全部移除
$.ajax({ //再發一次ajax請求過去拿到這個id的所有option
url:c+"/regionServlet?ID="+this.value,
success:function(data){
for(index in data){
// console.log(data[index]);
$("#city ").append("<option value='"+data[index].ID+"'>"+data[index].REGION_NAME+"</option>");
}
},
dataType:"json"
});
});
$("#city").change(function(){
$("option:gt(0)","#county").remove();
$.ajax({
url:c+"/regionServlet?ID="+this.value,
success:function(data){
for(index in data){
console.log(data[index]);
$("#county").append("<option value='"+data[index].PARENT_ID+"'>"+data[index].REGION_NAME+"</option>");
}
},
dataType:"json"
});
});
})