一个JSON数据格式化的显示的问题

cpp_1 2020-09-11 09:58:48


页面布局见图片

现在有没有办法在form提交以后,在ifram里面提到返回的JSON结果,对它进行格式化后显示在右边。
...全文
4783 6 打赏 收藏 转发到动态 举报
写回复
用AI写文章
6 条回复
切换为时间正序
请发表友善的回复…
发表回复
風灬雲 2020-09-14
  • 打赏
  • 举报
回复
var data = '[{"name":"黑子","sex":"男","Age":25,"hobby":["篮球","跑步","看电影","王者荣耀"],"normal":true},{"name":"张三","sex":"男","Age":25,"hobby":["上天","入地"],"normal":false}]'; // 方法1:textarea + JSON.stringify function parse1(str) { return JSON.stringify(JSON.parse(str), null, "\t  "); } test.innerHTML = parse1(data); 容器test 加上 css 属性 white-space: pre-line;
hookee 2020-09-12
  • 打赏
  • 举报
回复
参考 https://www.cnblogs.com/xiao987334176/p/11359130.html
cpp_1 2020-09-12
  • 打赏
  • 举报
回复
这个是什么页面,DEMO都跑不起来
天际的海浪 2020-09-12
  • 打赏
  • 举报
回复
比如后台返回的json是

[
	{"name":"张三","phone":"13643666432"},
	{"name":"李四","phone":"13668745577"},
	{"name":"王五","phone":"13668454542"}
]
html代码

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title> 页面名称 </title>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<form id="formId">
	<input type="text" name="test" value="aaaaaa" />
	<input type="button" value="提交" onclick="s();" />
</form>

<div id="box"></div>

<script type="text/javascript">
function s() {
	var data = $("#formId").serialize();
	$.ajax({
		url: "请求的后台地址",
		type: "POST",
		data: data,
		dataType: "json",
		success: function (data) {
			var str = '<table>';
			for (var i = 0; i < data.length; i++) {
				str += '<tr><td>'+ data[i].name +'</td><td>'+ data[i].phone +'</td></tr>';
			}
			str += '</table>';
			$("#box").html(str);
		}
	});
}
</script>
</body>
</html>
cpp_1 2020-09-11
  • 打赏
  • 举报
回复
方案一,让后台推出格式化后的JSON,后台不能用,所以方案一,没有可行性 方案二,有没有在具体一点的信息
天际的海浪 2020-09-11
  • 打赏
  • 举报
回复
方案一是不要让后台xxx/xx返回json数据,而是要在后台直接返回格式化好的html页面来更新ifram里的页面。 方案二是不用form提交。而是用ajax请求后台xxx/xx返回的json数据,在前端js中格式化成你需要的html代码,用js动态更新ifram页面的内容。

61,110

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧