Ajax处理success回调函数返回的json数据。

站长最近在项目中用调用一个分类的子数据,由于表单要填写的数据较多,为了实现无刷新的选择操作,就使用ajax做了异步查询。查询的结果因为是多条数据,一直以来动用ajax查的都是单数据,还第一次使用多数据,惭愧。TP5中查询的结果已经是一个数组对象,如果直接return回去,那么success函数获取的是一个对象,对象操作的结果还是要再一次转换成数组,讲起来都觉得麻烦,别说操作了。最好是直接返回字符串或者json。

开始做的时候想着,直接用PHP把数组处理好,返回给前端就好直接用了,所以对查询结果进行json编码,这个很简单,利用PHP内置json操作函数json_encode对array进行编码操作,然后return回去即可。原本想着直接使用返回的json数据去遍历填充页面了,万万没想到,折腾好大一会儿没成功。使用alert弹了下返回的data,完整的显示是一个json呐,为毛就遍历不到呢。

不得已,去翻了前端基础宝典w3school.com.cn上的关于jquery.ajax的手册部分。找到原话这样描述:

好家伙,虽然datatype定义的是json,这最后不还是个字符串吗?不过需要声明的是json原本就是字符串,只是是一种特殊格式的字符串而已。

既然是字符串的话,只能先把json字符串转换为JavaScript对象了。站长的JavaScript基础一直处于渣渣水准,所以接着翻w3school的手册。在json章节中找到了这段:

这就简单了,现在只需将success返回的data丢到eval函数中就完事了,所以站长就匆匆写下这句var dataObj = eval("("+data+")");就操作后续重写html的事情了。待把功能昨晚,准备关闭网页的时候,看到手册下半部分竟然有个json解析器。这是个嘛玩意儿?好奇心驱使就去看了下:

咦,这文字里面只提到json解析器,可并没有描述json解析器长什么样子啊?(手册也有不完善的地方)点到亲自试一试后终于见到了真容。JSON.parse()

那么依葫芦画瓢,var dataObj = JSON.parse(data);就妥了。简单测试了一下两种方法,都可以实现。

至于前图中提到的潜在风险,你自己去体会吧。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏python学习路

二、Python介绍

Python 是一门什么样的语言? python是一门动态解释性的强类型定义语言。 编程语言主要从以下几个角度为进行分类,编译型和解释型、静态语言和动态语言、...

3824
来自专栏Golang语言社区

十条有用的 Golang语言 技术

十条有用的 Go 技术 这里是我过去几年中编写的大量 Go 代码的经验总结而来的自己的最佳实践。我相信它们具有弹性的。这里的弹性是指: 某个应用需要适配一个灵...

4179
来自专栏企鹅FM

深入浅出Kotlin协程

协程(Coroutines)已经随着Kotlin1.3版本一起发布了1.0正式版,android平台可以使用如下方式引入:

4.7K8
来自专栏Android机动车

设计模式——代理模式

现在有个非常流行的程序叫做面向切面编程(AOP),其核心就是采用了动态代理的方式。怎么用?Java为我们提供了一个便捷的动态代理接口 InvocationHan...

1041
来自专栏网络

编码在网络安全中的应用和原理

前言:现在的网站架构复杂,大多都有多个应用互相配合,不同应用之间往往需要数据交互,应用之间的编码不统一,编码自身的特性等都很有可能会被利用来绕过或配合一些策略,...

3056
来自专栏owent

小记最近踩得两个C++坑

记一下最近踩得两个C++独有的暗坑,其中一个和ABI相关。第二个坑其实之前研究过,但是没有实例,这次算是碰到了个典型的实例。

1142
来自专栏jeremy的技术点滴

golang语言常见范式

4464
来自专栏Golang语言社区

Go语言的 10 个实用技术--转

十条有用的 Go 技术   这里是我过去几年中编写的大量 Go 代码的经验总结而来的自己的最佳实践。我相信它们具有弹性的。这里的弹性是指:   某个应用需要适配...

3677
来自专栏WeTest质量开放平台团队的专栏

Unity3d底层数据传递分析

这篇文章主要分析了在Mono框架下,非托管堆、运行时、托管堆如何关联,以及通过哪些方式调用。内存方面,介绍了什么是封送,以及类和结构体的关系和区别。

6332
来自专栏程序员与猫

Go Code Review Comments 译文(截止2018年7月27日)

持续更新中… 原文最新链接 https://github.com/golang/go/wiki/CodeReviewComments/5a40ba36d38...

1663

扫码关注云+社区

领取腾讯云代金券