开发者社区> 问答> 正文

ajax获取后台的json数组,怎样添加到table里面:报错

请教各位一个问题,用ajax提交到后台方法,返回一个json数组,在前台怎么去将这个json数据读取出来放在table里面。

展开
收起
kun坤 2020-06-07 16:26:48 756 0
1 条回答
写回答
取消 提交回答
  • 首先要把接受到的json格式字符串 转化为json对象。那你可以这样:
    ①如果用jquery的ajax,只需要指定接受字符串的dateType为 json,这时候的实参data就已经是js对象了。
    ②如果不用jquery的ajax,直接执行eval(如三楼采用的: var jsonObj = eval(jsonStr);eval 本身的作用就是执行字符串 )。
    ③还有就是parseJSON();和parse()这俩方法了(貌似需要浏览器支持,或者引入JSON2.js)。

    得到了 对象一切就好说了。如果是数组格式(比如后端的json是根据ArrayList序列化来的)可以像操做数组一样直接根据index取得相应数据。如果是键值对(后端是map序列化成的标准json格式{'key1':value1;'key2':value2;...}) 那就直接key.value就能取得相应数据了。

    ######受用了 。谢谢!######

    后台语言是php么?我的是php,一份样码:

    后台用 echo json_encode("xx");返回json数据,下面的success:function(data)中的data就是json数据,然后就eval(data)赋给一个变量,然后当这个变量像数组一样使用,我也不知道为什么用eval,之前百度人家是这么写的,大概就是将json数据转换成数组吧,我是半桶水。然后可以用jquery的append或者html方法添加到你想添加的地方。

    $.ajax({
    		    type:"GET",
    			url:"../act/zoneAction.php?action=find_nextpage_comment&page="+page+"&picid="+picid,
    			dataType:"json",
    			success:function(data){
    			   var html = '';
    			   var result = eval(data);
    			   var length = result.length>2?2:result.length;
    			   for(var i = 0;i<length;i++)
    			   {
    			      html+="<div class=\"guest_comment\"><div class=\"guest_cover\"><img src=\""+result[i]['user']['Cover']+"\"></div><div class=\"guest_comment_content\"><p>"+result[i]['Content']+"</p></div><div style=\"clear:both;\"></div></div><hr style=\"color:#ffffff;width:100%;clear:both;\">";
    			   }
    			   $("#change_comment").html(html);
    			}
    		 });

    ######谢谢了!很受用######jquery######
    function makeEducPlanTable(){
            var data = eval('(' + responseText + ')');
    	var tab = $("#educPlanContent");
    	var html = [];
    	if(data.length > 0){
    		var trBgColor = '#FFFFFF';
    		for(var i=0;i<data.length;i++){
    			if(i%2 == 0){
    			  trBgColor = "#FFFFFF";
    			}else{
    			  trBgColor = '#F5FAFA';
    			}
    			var plan = data[i];
    			html.push("<tr align='center' valign='middle' bordercolor='#0000FF' bgcolor='"+ trBgColor +"' id='childPlan'"+ plan.childNo +">");
    			html.push("<td><input type='checkbox' value='"+ plan.childNo +"' name='childPlan'/></td>");
    			html.push("<td>"+ plan.num +"</td>");
    			html.push("<td>"+ plan.age +"</td>");
    			html.push("<td>"+ plan.startEduAge +"</td>");
    			html.push("<td>"+ plan.sEduStage +"</td>");
    			html.push("<td>"+ plan.eEduStage +"</td>");
    			html.push("</tr>");
    		}
    	}
    	tab.html("");
    	tab.append(html.join(""));
    }
    ######回复 @笑医久久 :######回复 @易万军 : 普通的JavaScript######能否告知这是什么技术啊?######多讲一句,1楼贴的代码第七行的  eval(data);是多余的。######哦哦,谢谢啊:)
    2020-06-07 16:26:53
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载