ajax的常見幾種寫法以及用法
一、服務端資料格式
1.自定義po類
package com.hbut.ssm.po; /** * pojo類 * */ public class Children { private String name; private Integer age; private String gender; public Children(String name, Integer age, String gender) { super(); this.name = name; this.age = age; this.gender = gender; } public String getName() { return name; } public void setName(String name) { this.name = name; } public Integer getAge() { return age; } public void setAge(Integer age) { this.age = age; } public String getGender() { return gender; } public void setGender(String gender) { this.gender = gender; } }
2.controller準備需要返回的資料
//測試json的輸出 @RequestMapping(value="/getChildrenList") public @ResponseBody List<Children> getChildrenList(HttpServletRequest request){ System.out.println("獲取前端的引數:"+request.getParameter("name")); List<Children> childrenList= new ArrayList<Children>(); childrenList.add(new Children("張三", 25, "男")); childrenList.add(new Children("李四", 28, "男")); childrenList.add(new Children("小紅", 22, "女")); return childrenList; }
二、ajax請求並解析資料
方式1:不帶引數 $ajax(url,callback),即第一個引數是請求的url,第二個引數是回撥用函式,json資料封裝在result,需要對result的json資料進行解析
$(document).ready(function(){ $("button").click(function(){ $.ajax({url:"http://localhost:8080/ssm01/getChildrenList.action", success:function(result){ //eval函式解析json資料 var array=eval(result); var texts="解析json資料如下:<br>"; for(var i=0;i<array.length;i++){ texts+=array[i].name+"--"+array[i].age+"---"+array[i].gender+";<br>"; } $("#div1").html(texts); }}); }); });
方式2:帶引數 $.post(url,data,callback),即第一個引數是請求的url,第二個引數是請求引數,第三個引數是回撥用函式,json資料封裝在result,需要對result的json資料進行解析
$(document).ready(function(){
$("button").click(function(){
$.post("http://localhost:8080/ssm01/getChildrenList.action",{
name:"菜鳥教程",
url:"http://www.runoob.com"
},
function(data,status){
//eval函式解析json資料
var array=eval(data);
var texts="解析json資料如下:<br>";
for(var i=0;i<array.length;i++){
texts+=array[i].name+"--"+array[i].age+"---"+array[i].gender+";<br>";
}
$("#div1").html(texts);
});
});
});
測試結果如下:
方式三:請求為json方式,請求的引數格式json,返回的是json(與上面請求url不一樣,原理類似)
//請求json,輸出是json
function requestJson(){
$.ajax({
type:'post',
url:'${pageContext.request.contextPath }/requestJson.action',
contentType:'application/json;charset=utf-8',
//資料格式是json串,商品資訊
data:'{"name":"手機","price":999}',
success:function(data){//返回json結果
alert(data);
}
});
}
方式四:請求為key、value方式,返回的是json,(與上面請求url不一樣,原理類似)
//請求key/value,輸出是json
function responseJson(){
$.ajax({
type:'post',
url:'${pageContext.request.contextPath }/responseJson.action',
//請求是key/value這裡不需要指定contentType,因為預設就 是key/value型別
//contentType:'application/json;charset=utf-8',
//資料格式是json串,商品資訊
data:'name=手機&price=999',
success:function(data){//返回json結果
alert(data.name);
}
});
}
相關推薦
ajax的常見幾種寫法以及用法
一、服務端資料格式1.自定義po類package com.hbut.ssm.po; /** * pojo類 * */ public class Children { private Stri
jdbcTemplate.update()的幾種寫法 以及NamedParameterJdbcTemplate
api提供了update的幾種呼叫寫法 //方法一直接在sql中拼接好了引數之後呼叫即可 @Override public int update(final String sql) throws DataAccessException { Assert.notNull(s
mybatis中LIKE模糊查詢的幾種寫法以及注意點
mybatis中對於使用like來進行模糊查詢的幾種方式: (1)使用${...} 注意:由於$是引數直接注入的,導致這種寫法,大括號裡面不能註明jdbcType,不然會報錯 org.mybatis.spring.MyBatisSystemException: nested
資料繫結以及Container.DataItem幾種方式與用法分析
靈活的運用資料繫結操作 繫結到簡單屬性:<%#UserName%> 繫結到集合:<asp:ListBox id="ListBox1" datasource='<%# myArray%>' runat="server"&
php網站開發常見的幾種攻擊以及解決方案
PHP網站建設中常見的安全威脅包括:SQL 注入、操縱 GET 和 POST 變數、緩衝區溢位攻擊、跨站點指令碼攻擊、瀏覽器內的資料操縱和遠端表單提交。 1、防止SQL注入攻擊 在 SQL 注入攻擊 中,使用者通過操縱表單或 GET 查詢字串,將資訊新增到資料庫查詢中
設置顏色的幾種寫法
clas span ret keyword num string pretty ava ado 1. msgView.setBackgroundColor(Color.parseColor("#6D8FB0"));設置顏色的幾種寫法
單例模式幾種寫法
遺憾 想象 develop 由於 tcl loader adr 希望 線程不安全 第一種(懶漢,線程不安全): Java代碼 public class Singleton { private static Singleton instance;
java單例的幾種寫法
多線程 ibm 顯示 詳細 作者 jdk1.5 需要 fin serial 轉載出處:http://cantellow.javaeye.com/blog/838473 第一種(懶漢,線程不安全): 1 public class Singleton { 2 pr
Ajax參數的含義以及用法
sync 執行 時間 根據 p s process 角度 進一步 是否 以jquery.js為例講述ajax對應的參數以及用法 1.url: (發送請求的地址)(String)(默認為當前頁地址)。 2.type: (發送請求的方式,http請求方式)(String)(默認
mybaties中,模糊查詢的幾種寫法
uil 字符串 csdn clip data boa 大小寫 用法 .net 模糊查詢: 工作中用到,寫三種用法吧,第四種為大小寫匹配查詢 1. sql中字符串拼接 SELECT * FROM tableName WHERE name LIKE CONCAT(CO
python 學習筆記(循環,print的幾種寫法,操作符)
alt 例如 並且 col str .com 判斷 標準 一起 一、循環( for, while) while循環是指在給定的條件成立時(true),執行循環體,否則退出循環。for循環是指重復執行語句。 break 在需要時終止for /while循環 continue
ssh 登錄出現的幾種錯誤以及解決辦法
chang port apt-get his down ssi mis pan 其他 首先、確保server端的ssh服務是開的(service shhd start) 然後在client端輸入: ssh usrname@serverip (遠程登錄) scp filena
元素居中幾種寫法
transform solid bottom pla 所有 百分比 兼容ie height 必須 /** * 兼容所有瀏覽器,不兼容移動端 * 元素必須有固定寬度高度 */ .box{
Java多線程的幾種寫法
pri tca exc exce ++ executor main方法 多線程 ext Java多線程的在開發中用到的很多,簡單總結一下幾種寫法,分別是繼承Thread方法,實現Runnable接口,實現Callable接口;1.繼承Thread方法 class TestT
nginx 301重定向幾種寫法
nginx 301重定向 nginx強制跳轉 nginx nginx 301重定向寫法域名設置從http強制跳轉到https server {listen 80;server_name 100tt.com www.100tt.com 100tt.me 100tt.vip 100tt.org;re
js數組遍歷的常用的幾種方法以及差異和性能優化
object length 回調 value 鏈式操作 item IT rip 需要 <script type="text/javascript"> /*對比: 1、map速度比foreach快
Vue中app實例對象的幾種寫法
返回值 text vue urn PE fault 共享 div 練習 1.傳統方法(練習 小DEMO中用的這種) <script type="text/ecmascript"> var app=new Vue({
java的for循環的幾種寫法
控制結構 byte[] 操作 strings 賦值 容易 出錯 說明 最新版 J2SE 1.5提供了另一種形式的for循環。借助這種形式的for循環,可以用更簡單地方式來遍歷數組和Collection等類型的對象。本文介紹使用這種循環的具體方式,說明如何自行定義能被這樣遍歷
JVM之記憶體溢位的幾種情況以及可以採取的解決方案
開發中遇到過以下三種記憶體溢位的狀況: 一、 java.lang.OutOfMemoryError: Java heap space 二、 java.lang.OutOfMemoryError: PermGen space 三、 java.lang.OutO
linux裝置驅動 按鍵幾種寫法總結
對於基礎按鍵的驅動,有如下幾種寫法: (1)查詢 所謂查詢方法,主要描述應用程式會在while(1)裡面一直read,如果沒有資料會導致阻塞,佔用CPU;這種方法是最差的。 (2)中斷 中斷配合休眠會避免查詢法佔用CPU的缺點。 應用程式和查詢法沒有什麼區別, 但是驅動裡面的read