|  RSS订阅  |  加入收藏

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

​Ajax的success函数返回的json数据在JavaScript中再利用需要先行解析。利用json解析器完成叫json转换成JavaScript对象的操作。
摘要

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


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

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

未标题-1.jpg

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

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

未标题-2.jpg

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

未标题-3.jpg

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

未标题-4.jpg

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

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


如文章有用,给个赞助吧
  Ajax    JSON    
转载请注明出处,未经许可禁止商用!
发表评论
*依据《网络安全法》规定,您需实名认证后才能评论!

西枫里人
@心动科技:一起加油,欧耶~

心动科技
@西枫里人:哪里有,我也就是学的玩玩的,加油哈~

西枫里人
@心动科技:心动大佬见笑了,这种小儿科的东西对你来说就是分分钟的事~

心动科技
最膜拜的是你自己写的博客系统,膜拜膜拜。

小斌博客
@西枫里人:对呀,但是有成就感一点

西枫里人
@小斌博客:可以可以,我的这个系统也是我自己写的。自己的程序好就好在想怎么改就怎么改,缺点就是想要个功能就得自己写,没的插件。笑

小斌博客
@西枫里人:谢谢大佬指点,那我巩固php吧,想自己写一个博客系统

西枫里人
@小斌博客:两手抓两手都要硬。个人建议先搞精通一门再来一门。俗话说门门通不如一门精啊。

小斌博客
@西枫里人:对呀 最近就是纠结中,不知道是巩固php还是学点Python

西枫里人
@小斌博客:这个可以有,业余时间多学一门技能杠杠的~

小斌博客
@西枫里人:应该没有,不过最近很皮。准备自己学下其他的语言

西枫里人
@小斌博客:没被老板发现吧,哈哈哈~

小斌博客
哈哈哈,今天想给公司网站加点好玩的。。结果页面错位了,哎!

西枫里人
@银色乐航:还真不知道mac什么键打开网页调试控制台诶。 链接在这里:https://www.anji66.net/life.html

银色乐航
我去。。mac的F12怎么刷出来,看不到的心灵鸡汤

西枫里人
@里维斯社:感谢测试,已修复百度浏览器的兼容性问题。

西枫里人
@里维斯社:目前执行的逻辑就是在哪个页面执行的登录就回调到哪个页面。应该没有问题吧。

里维斯社
看到函数就头眼发昏,你的登录跳转好像有问题,每次登录成功又跳转到登录页面