springmvc和js前端的數(shù)據(jù)傳遞和接收方式(兩種)
更新時(shí)間：2017年12月22日 10:34:00 作者：wushuchu
本文介紹了springmvc和js前端的數(shù)據(jù)傳遞和接收方式(兩種)，詳細(xì)的介紹了兩種方式，一種是json格式傳遞，另一種是Map傳遞，具有一定的參考價(jià)值，有興趣的可以了解一下
在springmvc中controller的結(jié)果集可通過(guò)json格式傳到j(luò)s前端接受，也可以通過(guò)Map傳給前端，具體實(shí)現(xiàn)如下
1，通過(guò)json格式傳遞
controller層實(shí)現(xiàn)如下
@RequestMapping("queryCityInfo")
@ResponseBody
public String queryCityInfo()throws Exception{
String provinceId = getString("id");
@SuppressWarnings("rawtypes")
List cityList = personalService.queryCity(provinceId);
if(null != cityList && cityList.size() >0 ){
String json = JSONUtils.toJSONString(cityList);
super.outStr(json);
}
return null;
}
protected void outStr(String str)</span>
{
try
{
response.setCharacterEncoding("UTF-8");
response.getWriter().write(str);
}
catch (Exception e)
{
}
}
public static <T> String toJSONString(List<T> list)
{
JSONArray jsonArray = JSONArray.fromObject(list);
return jsonArray.toString();
}
js端接受如下
function selectBankCity(id){
$.ajax({
url:baseAddress+"queryCityInfo.do?provinceId="+id,
type:'get',
dataType:'json',
success:function(data){
$('#custBankArea').empty();
$('#custBankArea').append("<option >--請(qǐng)選擇城市信息--</option>");
for(var i=0;i<data.length;i++){
$('#custBankArea').append("<option value='"+data[i].id+"'>"+data[i].cityName+"</option>");
}
}
});
}
2，通過(guò)Map傳遞
controller層實(shí)現(xiàn)如下
@RequestMapping("queryProvince")
@ResponseBody
public Map<String, Object> queryProvince(HttpServletRequest request,HttpServletResponse response){
Map<String, Object> map = new HashMap<String, Object>();
try {
@SuppressWarnings("rawtypes")
List provinceList = personalService.queryProvince();
if(null != provinceList && provinceList.size() >0 ){
map.put("province", provinceList);
}
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return map;
}
js端接受如下
$.ajax({
url:baseAddress+"queryProvince.do",
type:"get",
success:function(resData){
var data = resData.province;
for(var i=0;i<data.length;i++){
//js實(shí)現(xiàn)
//var objs = document.getElementById("cusBankCity")
//objs.options.add(new Option(data[i].provinceName) ,data[i].id);
//jq實(shí)現(xiàn)
$("#cusBankCity").append("<option value='"+data[i].id+"'>"+data[i].provinceName+"</option>");
}
}
});
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
大家好，本篇文章主要講的是Java字符串拼接詳解，感興趣的同學(xué)趕快來(lái)看一看吧，對(duì)你有幫助的話記得收藏一下2022-02-02
Java計(jì)算Date類時(shí)間差實(shí)例代碼演示
最近工作中遇到需要計(jì)算時(shí)間差,這里給大家總結(jié)下,下面這篇文章主要給大家介紹了關(guān)于Java計(jì)算Date類時(shí)間差的相關(guān)資料,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-12-12
SpringBoot+Redis隊(duì)列實(shí)現(xiàn)Java版秒殺的示例代碼
本文主要介紹了SpringBoot+Redis隊(duì)列實(shí)現(xiàn)Java版秒殺的示例代碼，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-06-06
把多個(gè)文件打包成一個(gè)壓縮包——這個(gè)壓縮包和WinZip的壓縮格式是一樣的,區(qū)別在于jar壓縮的文件默認(rèn)多一個(gè)META-INF的文件夾,該文件夾里包含一個(gè)MANIFEST.MF的文件,本文給大家介紹Java如何使用jar命令打包,感興趣的朋友跟隨小編一起看看吧2023-10-10
Spring Boot實(shí)現(xiàn)數(shù)據(jù)訪問(wèn)計(jì)數(shù)器方案詳解
在Spring Boot項(xiàng)目中，有時(shí)需要數(shù)據(jù)訪問(wèn)計(jì)數(shù)器，怎么實(shí)現(xiàn)數(shù)據(jù)訪問(wèn)計(jì)數(shù)器呢？下面小編給大家?guī)?lái)了Spring Boot數(shù)據(jù)訪問(wèn)計(jì)數(shù)器的實(shí)現(xiàn)方案，需要的朋友參考下吧2021-08-08
這篇文章主要介紹了Java方法的返回值及注意事項(xiàng),本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-04-04
反射就是加載類,并解剖出類的各個(gè)組成部分,下面介紹了java反射機(jī)制示例,大家參考使用吧2014-01-01
這篇文章主要介紹了Java Map.entry案例詳解,本篇文章通過(guò)簡(jiǎn)要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-08-08
Java實(shí)現(xiàn) 基于密度的局部離群點(diǎn)檢測(cè)------lof算法
這篇文章主要介紹了Java實(shí)現(xiàn) 基于密度的局部離群點(diǎn)檢測(cè)------lof算法,本文通過(guò)算法概述,算法Java源碼,測(cè)試結(jié)果等方面一一進(jìn)行說(shuō)明,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-07-07
Java實(shí)現(xiàn)差分?jǐn)?shù)組的示例詳解
差分?jǐn)?shù)組是由原數(shù)組進(jìn)化而來(lái)，值為原數(shù)組當(dāng)前位置值減去上一個(gè)位置的值。本文將通過(guò)例題詳解如何利用Java實(shí)現(xiàn)差分?jǐn)?shù)組，需要的可以參考一下2022-06-06