jQuery中使用$.each()遍历后台响应的json字符串问题
今天在做练习项目的时候,使用$.each()方法遍历后台传过来的json字符串时,chrome浏览器中发现如下问题 Cannot use 'in' operator to search for 'length'...... 琢磨了好久,百思不得其解。前后台代码分别如下:
后台返回json字符串:
$sql = "select pid, pname, price, pic, did, count from jd_product, jd_cart_detail where pid=productId and cartId=$cid";
$result = mysqli_query($conn, $sql);
$list = mysqli_fetch_all($result, MYSQLI_ASSOC);
echo json_encode($list);
前台接收并处理:
$.ajax({
type: "GET",
url: "data/cart_detail_select.php",
data: {uid: loginUid},
success: function(list){
var h = "";
$.each(list, function(i, p){
h += `
some code....
`;
});
$("#cart>tbody").html(h);
},
error: function(obj){
alert("响应完成但有错误");
console.log(obj);
}
});
好了,问题来了,$.each()方法中,list参数就是后台传来的json字符串(echo json_encode($list);),然而在各种调试后,浏览器依然顽固的报着文章开头的错误。无奈,几经尝试,最终找到了解决方案,虽然解决了问题,但是我还是不明白为什么这样做,解决如下:
将list参数,再用JSON.parse(list),包装一次,方可正常运行。
出问题那一行代码修改后如下:
$.each(JSON.parse(list), function(i, p){})。
如果有大神看到此文章并且知道原因,请不惜赐教。
jQuery中使用$.each()遍历后台响应的json字符串问题的更多相关文章
- JQuery中根据表单元素动态拼接json 字符串
// <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o ...
- 使用JQuery将前端form表单数据转换为JSON字符串传递到后台处理
一般地,我们在处理表单(form表单哦)数据时,传输对象或字符串到后台,Spring MVC或SpringBoot的Controller接收时使用一个对象作为参数就可以被正常接收并封装到对象中.这种方 ...
- 基于Bootstrap的JQuery TreeView树形控件,数据支持json字符串、list集合(MVC5)<二>
上篇博客给大家介绍了基于Bootstrap的JQuery TreeView树形控件,数据支持json字符串.list集合(MVC5)<一>, 其中的两种方式都显得有些冗余.接着上篇博客继续 ...
- jQuery中使用$.each()遍历数组时要注意的地方
使用jQuery中 $.each()遍历数组,要遍历的数组不能为空(arry!="") 例如: $.each(arry, function (i, item) ...
- JS和jQuery中ul li遍历获取对应的下角标
首先先看代码: html代码部分: <div id="div"> <ul> <li>1111111</li> <li>2 ...
- jQuery中serializeArray方法的使用及对象与字符串的转换
使用jQuery中的serializeArray()方法可以方便的将表单中的各个信息,转化为多个{name:xx,value:xx}对象的数组, 再使用遍历的方式可以方便的将数组转化为json对象, ...
- 做筛选遍历时遇到的json字符串、json对象、json数组 三者之间的转换问题
这个是后台对登录用户以及筛选条件的操作 @Override public List<SdSdPer> listResults(String sidx, String sord) { try ...
- wemall app商城源码中基于JAVA通过Http请求获取json字符串的代码
wemall-mobile是基于WeMall的Android app商城,只需要在原商城目录下上传接口文件即可完成服务端的配置,客户端可定制修改.分享其中关于通过Http请求获取json字符串的代码供 ...
- java后台处理解析json字符串的两种方式
简单说一下背景 上次后端通过模拟http请求百度地图接口,得到的是一个json字符串,而我只需要其中的某个key对应的value. 当时我是通过截取字符串取的,后来觉得不太合理,今天整理出了两种处理解 ...
随机推荐
- jsp中的盲区-面试可能会问到的东西
1.今天看到一个有趣的JSP题目. <body> This is my JSP page. <br> <% int a = 10; %&g ...
- 谷歌Chrome浏览器提示adobe flash player已过期完美解决办法
最近使用谷歌Chrome浏览器提示adobe flash player已过期,浏览网页时一些flash元素的东西都无法正常显示,在网上尝试寻找很多方法,都不能解决,最后,经测试有效方法如下:一:下载最 ...
- 【转】NOR Flash擦写和原理分析
1. NOR FLASH 的简单介绍 NOR FLASH 是很常见的一种存储芯片,数据掉电不会丢失.NOR FLASH支持Execute On Chip,即程序可以直接在FLASH片内执行(这意味着存 ...
- Win10开启“上帝模式”
win10的上帝模式就是win10的全部功能展示模式,因为功能太强大,所以被戏称为"上帝模式".要开启win10的上帝模式,需要按下面的步骤来操作:1.在window桌面新建一个普 ...
- LINUX 笔记-scp命令
从本地服务器复制到远程服务器: (1) 复制文件: 命令格式: scp local_file remote_username@remote_ip:remote_folder (2) 复制目录: 命令格 ...
- Yii2之AR类的坑与总结
本文主要记录本人从学习yii2到使用yii2开发项目过程中遇到的一些问题以及解决方法和知识点总结. 1. AR类关联哪个数据表? 默认情况下,AR类会根据类名称关联和类名相关的数据表,如:类名为Cou ...
- TDD 之 Dojo coding
dojo和kata的练习记录: 进入 http://cyber-dojo.org/ 由一个人进行 setup a default practice,然后创建: 这里支持各种语言和各种测试框架,这里 ...
- 使用SQL Server2014作业定时执行无参的存储过程
一.存储过程 1.新建存储过程 按照下图找到存储过程,右键“新建”选择”存储过程” 此时在右侧会打开一个窗口,如下图. 2.填写创建存储过程语句 填写存储过程名称,因为是无参的存储过程,所以把参数部分 ...
- Code Lock
Code Lock Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 131072/65536 K (Java/Others) Total Su ...
- 启动Apache出现问题:一直停留在启动界面
问题描述: 由于需要php_curl模块,因此直接在php.ini文件将前面的分号去掉 ,但是重启Apache时出现:一直停留在启动界面,Apache无法正常启动,查看错误日志,显示如下: 解决方 ...