JQuery中Ajax实现对Map,List集合数据的接收

最新推荐文章于 2024-05-27 15:16:33 发布
最新推荐文章于 2024-05-27 15:16:33 发布
阅读量3.4w 收藏 10
点赞数
分类专栏： JavaScript Java 文章标签： jquery ajax ajax接收map ajax接收list jquery+map
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Justnow_/article/details/51219441
版权

jQuery中Ajax接收后台Map、List集合数据实现过程

最近学习到jQuery实现异步传输数据部分，虽然跟着视频演练了常规json数据的接收，但个人感觉不太够，现实应用中肯定不只是传输简短以及简单的json数据，于是自己琢磨着尝试从后台接收List、Map数据，在搜索工具的帮助以及自身的理解下，成功完成了接收过程。废话不多说，以代码来展示过程：

* 前端jsp登录端代码+js代码

//body部分
<body>
    <div id="loginDemo">
        用户名:<input type="text" id="username"><br>
        密&nbsp;码<input type="password" id="password"><br>
        <input type="button" value="登录" id="btn"/><br>
        <span id="msg"></span>
    </div>
    <div id="showUsers"></div>
</body>
//js部分
$(document).ready(function(){
    $("#btn").click(function(){
        var params ={
  "user.username":$("#username").val(),
最低0.47元/天 解锁文章
Justnow_
关注
  • 0
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
利用ajax请求，后台返回map，ajax中解析map数据
荒的博客
10-24 1万+
后台返回的数据为： Map&lt;String, String&gt; mapList = new HashMap&lt;String, String&gt;(); mapList.put(key, value); Map&lt;String, Map&lt;String, String&gt;&gt; map = new HashMap&lt;String,Map&lt;String, St...
JQuery 遍历map，ArrayList
机会靠自己争取，不要拿道德让别人施舍
01-27 940
         最近一直在写前端，发现用jquery的each一样可以取map，且顺序和map中顺序一致。 var js = { map:{ 班级:["一班","二班","三班"], 人员:["50人","60人","70人"] }, arrayList :{ one:1, two:2, three:3 },
前端使用ajax发送请求，后端返回List＜Map＞型数据，然后遍历
最新发布
weixin_44702501的博客
05-27 260
前端使用ajax发送请求，后端返回List型数据，然后遍历
jQuery的Ajax实现异步传输List、Map
10-19
前后台传送list及map,包含了传json时所需要的包及相关内容
ajax servlet怎么接收_【百战程序员从开始到植发】之AJAX
weixin_39940344的博客
11-27 2181
删除用户功能实现 根据视频中的讲解，完成以下内容简述删除功能的基本思路流程独立完成删除按钮的创建以及删除请求路径的修改完成删除功能的Servlet的实现 删除用户信息和问题说明 删除用户信息和问题说明 什么是当前请求页？ajax介绍&ajax的访问原理视频中ajax的特点是？实现网页的局部刷新。根据视频总结ajax的基本原理Ajax的核心为ajax对象引擎，可以向服务器发送xm...
jquery遍历从后台返回的List<Map>
weixin_34189116的博客
12-25 1256
2019独角兽企业重金招聘Python工程师标准>>> ...
jQuery接受后台传递的List
程诺
05-26 6626
后台代码：@RequestMapping(params = "getUserPositionByUserId") @ResponseBody public List<User> getUser(){ List<User> list = new ArrayList<>();return list; }前台代码：$.ajax({ type: "POST", url: "${pa
Ajax传递map数据
Abracadabra丶的博客
04-01 4210
利用ajax传递key-value键值对
jquery Ajax实现Select动态添加数据
10-19
在本案例中，我们将深入探讨如何使用jQuery和Ajax技术来实现在Select元素中动态添加数据，这通常用于实现交互式的用户界面，如联动下拉菜单。 首先，背景情况是这样的：传统的Select元素通常在页面加载时就包含了...
jQuery的Ajax接收java返回数据方法
12-12
在Web开发中，前端与后端的交互是一个关键环节，jQuery的Ajax功能使得前端能够异步地从服务器获取数据，而无需刷新整个页面。本文主要介绍如何使用jQuery的Ajax方法来接收Java后端返回的数据。 首先，我们看前端的...
jQuery+Ajax-9(静态方法map方法)
aka程序皇像隔扣你的勒布朗进入名人堂的博客
08-12 111
静态方法map方法 <script src="js/1.12.4.js"></script> <script> /* * 第一个参数：要遍历的数组 * 第二个参数：每遍历一个元素执行的回调函数 * * 回调函数的参数： * 第一个参数：遍历到的元素 * 第二个参数：遍历到的索引 * * 注意...
MVC下使用ajax接收后台的map值 笔记
12-21
项目中有一个功能涉及到需要用ajax接收后台传回来的多个值，在已经实现了传回一个值的基础上，我以为将后台的多个值打包成map传回来就完成了，谁想到错误百出。翻看了一上午的博客，没有一个能直接解决我的问题，总是看别人好像可以，我就不行，挣扎了许久终于从这个巨坑里面爬出来了，特此记录一下，如果有情况相同的可以适当借鉴一下。 第一步，先贴代码： 后台controller @RequestMapping(value = "/ajax/getStatus/map") @ResponseBody public Map ajax_uploadStatus_map(HttpSession
后台返回map，前台 jQuery 接收，并操作
weixin_30384217的博客
08-08 1139
$("#get_shuju").click(function () { var userId = $("#inUser").val(); var date = $("#user_date").val(); // var date1=JSON.stringify(date); // 前台的Date型日期，强制转化成String型Date(eg:2018-08-04转变成"20...
ajax获取java后台返回map结果集（ajax发送数据，接收数据）
weixin_40571937的博客
08-04 1493
ajax获取java后台返回map结果集 ajax接收来自后台的数据 Ajax中success回调函数： success: function(data)是Ajax在请求成功后自动调用的，所以这个方法是Ajax调用的，那么该方法的参数（data）便是Ajax提供的了。其中function(data)的参数data是客户端请求后台，由后台返回的值。 ajax解析后台发来的map类型数据 在导入依赖之后，（可以使用fastjson或者Jackson），前后端数据的传递都是用json格式。 ajax解析后台发来的M
jQuery，ajax'map传值'与后端'接收map'应用实例(SSM框架)
临渊
10-20 6989
jquery无论是同时传递多个数据到后端，还是接收从后端传来的多个数据，这都是日常开发中很常见的。本文从后端SpringMVC处理实例出发，举了两个比较有代表性的例子： 1. 向后端传递单个数据，从后端返回Integer类型数据； 2. 向后端传递多个数据，从后端返回数组；
ajax 调用后端传递的map类型时
jaryle的专栏
12-17 4221
ajax 调用后端传递的map类型时，ajax的接收数据类型是json类型，那就需要把后端map转成json才能接收， 这里用到阿里巴巴的fastjson或者json-lib（比较老了，建议不用） Map转成json格式  Map map = new HashMap();  map.put("users", users);  map.put("u", u);  1.转成JSONArra
jQuery遍历map集合获取值
yunnuo的博客
03-01 2878
jQuery遍历map集合获取值 var data = {name1: aa,name2: bb,nam3: cc}; $.each(data, function (key, values) { console.log(key); console.log(values); });
在jquery ajax中，如果从后台往前台传一个List集合，前台解析
ryan1214的专栏
06-13 7146
1、 2、后台：       List test2 = new ArrayList();         User user1 = new User();         user1.setUser_age(23);         user1.setUser_email("tan@qq.com");         user1.setUser_id(1);   
Ajax如何处理List<Map>数据类型
bay233的博客
12-11 695
这里就不多啰嗦了，就写一个返回函数： function (data){ //从根本上说返回的就是一个list 我们只需要循环取出里面的map就行 for (var i in data){ //i表示的是data的下标 我们用下标取出里面的map 再用map["key"]取出value var value1 = data[i]["key1"]; var value2 = data[...
jQuery Ajax 输入json字符串 输出list或二维数组
05-27
在jQuery Ajax请求中，可以通过设置`dataType`参数来指定响应数据的类型。如果响应数据是一个JSON字符串，可以设置`dataType`为`json`，然后使用JavaScript的`map`方法将JSON对象转为数组。 示例代码如下： ```javascript $.ajax({ url: "your_api_url", type: "POST", data: your_json_data, dataType: "json", success: function(response) { // 将JSON对象转为数组 var list = $.map(response, function(value, index) { return [value]; }); console.log(list); }, error: function(jqXHR, textStatus, errorThrown) { console.log("Error: " + textStatus); } }); ``` 在上面的代码中，`response`是服务器返回的JSON对象。使用`map`方法将JSON对象转为数组，然后将数组输出到控制台。 如果响应数据是一个二维数组的JSON字符串，可以将`map`方法的回调函数稍作修改，示例代码如下： ```javascript $.ajax({ url: "your_api_url", type: "POST", data: your_json_data, dataType: "json", success: function(response) { // 将JSON二维数组转为二维数组 var list = $.map(response, function(value, index) { return [Object.values(value)]; }); console.log(list); }, error: function(jqXHR, textStatus, errorThrown) { console.log("Error: " + textStatus); } }); ``` 在上面的代码中，`response`是一个JSON二维数组。使用`map`方法将JSON二维数组转为二维数组，然后将数组输出到控制台。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值