js怎么将json数据展示在html代码,JS格式化json数据展示到页面中
html页面:
查询json结果
studyid* | |
partnerId | |
token | |
查询 |
查询结果:
css代码:
.red-text {
color: red;
}
.size-big {
width: 100%;
height: 100%;
}
.textarea {
width: 100%;
min-height: 20px;
/* max-height: 300px; */
_height: 120px;
margin-left: auto;
margin-right: auto;
padding: 3px;
outline: 0;
border: 1px solid #a0b3d6;
font-size: 12px;
line-height: 24px;
padding: 2px;
word-wrap: break-word;
overflow-x: hidden;
overflow-y: auto;
border-color: rgba(82, 168, 236, 0.8);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px
rgba(82, 168, 236, 0.6);
}
js代码:(分隔符避免在原json数据中存在)
$(function() {
$("#search").click(function() {
var studyid = $("#studyid").val();
var partnerId = $("#partnerId").val();
var token = $("#token").val();
if (check(studyid)) {
$.ajax({
type : "POST",
url : "upload/getDicomAiResult",
data : {
"studyid" : studyid,
"partnerId" : partnerId,
"token" : token
},
dataType : "json",
success : function(msg) {
var jsonStr = formatJson(msg);
$("#content").html(jsonStr);
}
});
}
})
function check(studyid) {
if ("" == studyid) {
alert("studyid不能为空")
return false;
}
return true;
}
function formatJson(msg) {
var rep = "~";
var jsonStr = JSON.stringify(msg, null, rep)
var str = "";
for (var i = 0; i < jsonStr.length; i++) {
var text2 = jsonStr.charAt(i)
if (i > 1) {
var text = jsonStr.charAt(i - 1)
if (rep != text && rep == text2) {
str += "
"
}
}
str += text2;
}
jsonStr = "";
for (var i = 0; i < str.length; i++) {
var text = str.charAt(i);
if (rep == text)
jsonStr += " "
else {
jsonStr += text;
}
if (i == str.length - 2)
jsonStr += "
"
}
return jsonStr;
}
})
js怎么将json数据展示在html代码,JS格式化json数据展示到页面中相关推荐
- layui数据表格搜索php代码,layui实现显示数据表格和搜索功能示例
本文实例讲述了layui实现显示数据表格和搜索功能.分享给大家供大家参考,具体如下: 搜索 layui.use('table', function(){ var table = layui.table ...
- 图片展示html css代码,纯CSS3实现图片展示特效
Web浏览器端的特效越来越让人兴奋,通过CSS和JavaScript,各种意想不到的绚丽效果都能用简单的几句代码完成.本文中要实现的一个纯CSS3的图片展示特效,以前只能用JavaScript实现,可 ...
- firefox如何载入json文件_如何去解决JS跨域问题 怎么能学好Web前端开发
如何去解决JS跨域问题?怎么能学好Web前端开发?JavaScript跨域是指通过JS在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过JS获取页面中不同域的框架中(if ...
- jsf取js变量_JSF页面中的JS取得受管bean的数据(受管bean发送数据到页面)
[问题]Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数. [解决]直接对变量加引号,如: 删除- http://blog.csdn.net/xxjoy_777/articl ...
- 移动硬盘格式化后数据怎么恢复
移动硬盘格式化后数据怎么恢复?移动硬盘是可移动的大容量存储设备,经常用来存储很多重要的数据文件.但同样使用中遇到的问题也不少,比如说移动硬盘的格式化.误删除.操作失误等.如果遇到不小心把移动硬盘格式化 ...
- js实现格式化JSON数据方法
前言: 最近做的项目中遇到个需要在前端页面中将某个设备需要的数据格式展示出来,方便用户配置.一开始单纯的将数据格式写入到pre标签中, 但是通过pre标签写入的数据格式在代码可视化上不是很优雅.由于上 ...
- JS格式化json并展示
一.格式化json数据展示区域 第1种: <div id="showJsonData1" contenteditable="true" style=&qu ...
- 用jQuery封装的Ajax把json数据展示到页面中去
实现一个聊天页面 我们下来看一下效果 图中的聊天信息先把它放在json数据中,通过jQuery封装的Ajax来把数据拿过来,再把它展示到页面中去,分为以下几步 为了方便操作,我们直接使用php stu ...
- html页面返回json数据为空,在Html页面中,展示出Json格式数据,且保持缩进格式...
1.定义一个标签,给个id值. 2.用js定义一个json字符串,用jQuery给id,赋值 var songResJson = { "id" : "b52c96bea3 ...
最新文章
- OSPF有五种报文,hello,dd,lsr,lsu,lsack
- 《云原生人才计划之Kubernetes 技术图谱》发布!
- Exchange Server 2003邮件服务器系统的基本部署思路
- 用python计算列表元素之和_python实现计算列表元素之和
- python备份虚拟环境
- ConcurrentProgramming:Atomic 原子类
- C#调用API函数EnumWindows枚举窗口的方法
- LeetCode-121. 买卖股票的最佳时机(java)
- 京东到家埋点治理实践
- Python - 深度学习系列2-人脸比对 Siamese
- 苹果手机滑动光标怎么设置_iPhone手机三种方便又准确的移动光标方式
- 中国式危机公关9加1策略(第七章 道歉先行策略)
- eclipse 提示 An internal error occurred during
- SSM框架专题-MyBatis框架老杜版从零入门笔记(下)
- 我是如何放弃 JSP,转向 REST 编程的
- 机器学习:准确率(Precision)、召回率(Recall)、F值(F-Measure)、ROC曲线、PR曲线
- Gox语言中如何处理XML-GX20
- 用web编写100以内的加法
- Linux病毒研究与分析
- 丝绸之路大数据交易中心成立
热门文章
- 中标麒麟系统u盘安装_骨灰级菜鸟用U盘装中标麒麟v5.0
- c语言简单逆序数123-321
- 开源数据版本管理组件 -- VersionRepository
- 华擎、映泰主板的网络唤醒(WOL)实例
- MPLS ××× 网络中的OSPF Sham-Link
- zip.001 zip.002 zip.003....如何解压
- SQLServer控制用户访问权限表
- 硬盘大涨价?CG动画渲染师:云存储更香了
- 数字化如何赋能电力调度、提升电网调度精准度灵活性、提升新能源消纳能力?互联网人如何参与泛在电力物联网和能源互联网?
- 在Linux系统搭建Hugo博客