<%@ page contentType="text/html; charset=UTF-8" %>

<%@taglib uri="/struts-tags" prefix="s"%>

<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c"%>

<%

	String path =request.getContextPath();

	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<html>

<head>

<title></title>

 <meta http-equiv="content-type" content="text/html; charset=UTF-8">

 <script type="text/javascript" src="<%=basePath %>js/jquery-1.9.1.js"></script>

<style type="text/css">

.table-result{

    width:100%;

    border:1px solid #f2f2f2;

    text-align:left;

    border-collapse: collapse;

}

.table-result th{

    height:40px;

    font-weight: normal;

    font-size:14px;

    line-height:22px;

    text-align:center;

    background-color:#f0f0f0;

    border-right:2px solid #fff;

    color:#4e4e4e;

    border-style: solid;

    border-width: 1px;

    border-color: gray;

}

.table-result td{

    text-align:center;

    height:40px;

    font-size:12px;

    line-height:22px;

    color:#4e4e4e;

    border-style: solid;

    border-width: 1px;

    border-color: gray;

    padding-left: 2px;

    padding-right:2px;

}

td

{

white-space:nowrap;

}

</style>

</head>

<body style="width: 100%;overflow: scroll;">

	<form action="upload!view.dhtml" method="post" style="margin-left:10px;">

	  <h2>原始记录</h2>

	      	<textarea id="origrec" rows="5" cols="80">${logQueryDataModel.origrec }</textarea>

	   <h2>最新记录</h2>

      		<textarea id="lastrec" rows="5" cols="80">${logQueryDataModel.lastrec}</textarea>

    </form>

</body>

</html>

<script>

$(document).ready(function(){

	$("textarea").each(function(i){

		var p = $(this).text();

		if($.trim(p)=="") $(this).replaceWith("");

		if(p!="\n\t\n\t"){

			var json;

			try{

				json = JSON.parse(p);

			var id="";

			if($(this).attr("id")!= null)

				id="id="+$(this).attr("id");

			var t1="<table class=table-result "+id+" ><thead><tr>";

			var flag=0;

			var tr1="<tr>";

			for(var j in json)

			{

				if(flag>0)

				{

					t1+="<tr>";

				}

				for(var item in json[j])

				{

					if(flag==0)

					{

						if(item!="")

							t1+="<th class=center style='font-size:10px;height:15px;width:100%;'>"+item+"</th>";

						tr1+="<td align=center style='height:15px;width:100%;'>"+json[j][item]+"</td>";

					}else

					{

						t1+="<td align=center style='height:15px;width:100%;'>"+json[j][item]+"</td>";

					}

				}

				if(flag==0)

					t1+="</tr></thead>"+tr1+"</tr>";

				else

					t1+="</tr>";

				flag++;

			}

			$(this).replaceWith(t1);

			}catch(e)

			{

			}

		}

	});

	var flag = 0;

	$("textarea").each(function(i){

		$(this).prev().remove();

		$(this).remove();

		flag+=1;

	});

	if(flag==2)

	{

		$("form").html("<h3>（此操作无详细数据）</h3>");

	}

	if(flag==1)

	{

		var ts = $("table[id$=rec]");

		for(var i=0;i<ts.length;i+=2)

		{

			for(var c=0;c<ts[i].rows[1].cells.length;c++)

			{

				var a = ts[i].rows[1].cells[c].innerText;

				var b = ts[i+1].rows[1].cells[c].innerText;

				if(a!=b)

				{

					ts[i].rows[1].cells[c].style.backgroundColor='gray';

					ts[i].rows[1].cells[c].style.color='white';

					ts[i+1].rows[1].cells[c].style.backgroundColor='gray';

					ts[i+1].rows[1].cells[c].style.color='white';

				}else if(a==""&&b=="")

				{

					ts[i].rows[0].cells[c].style.display='none';

					ts[i+1].rows[0].cells[c].style.display='none';

					ts[i].rows[1].cells[c].style.display='none';

					ts[i+1].rows[1].cells[c].style.display='none';

				}

			}

		}

		}

});

</script>

　　

JSON数据转换成table表格的更多相关文章

  1. 【转】C#中将JSon数据转换成实体类，将实体类转换成Json

    http://wo13145219.iteye.com/blog/2022667 http://json2csharp.chahuo.com/ using System; using System.C ...

  2. 利用JAVA反射机制将JSON数据转换成JAVA对象

    net.sf.json.JSONObject为我们提供了toBean方法用来转换为JAVA对象, 功能更为强大,  这里借鉴采用JDK的反射机制, 作为简单的辅助工具使用,   有些数据类型需要进行转 ...

  3. 将JSON数据转换成JAVA的实体类

    思路:首先将JSON格式的数据转换成JSONObject,然后将JSONObject转换成Java的实体类(其中类属性包括List等类型) Java实体类: SearchFilter 类 1 publ ...

  4. python - 将数据转换成 excl 表格, json 等文件 （dajngo - 打开网页后自动下载）

    本篇只讲述怎么用. 具体 tablib  更多详细用法可参考博客 : https://blog.csdn.net/liangyuannao/article/details/41476277 # 不得不 ...

  5. 怎么把后台传过来的Json拼成table 用Jquery ajax()

    页面上的表格定义:<table id="tableId"></table> js中的代码:var $parent0 = $('#tableId);//获取页 ...

  6. 把HDFS里的json数据转换成csv格式

      1. 全景图 2. 用ListHDFS获取所有文件名   如果想重新再取一次,右健view state:   点击 clear state, 再运行,即可再次采集数据了.   3. 用FetchH ...

  7. 【转】参照protobuf，将json数据转换成二进制在网络中传输。

    http://blog.csdn.net/gamesofsailing/article/details/38335753?utm_source=tuicool&utm_medium=refer ...

  8. C#实现调用接口数据获取数据格式化XML、json转成Table的方法

    废话不多说,直接上代码: json 格式化转DataTable: result为从接口得到的数据,格式化json的方法主要来自Newtonsoft.Json JObject joUnit = JObj ...

  9. 把json数据转换成集合

    Sting MessageList="";JSONArray json = JSONArray.fromObject(MessageList);JSONObject object ...

随机推荐

  1. bitbucket SSH 生成

    在bitbucket设置ssh的方法: 1.运行ssh-keygen. 2.一路enter,直接到结束. 3 seeting 中Bitbucket选择.ssh/id_rsa.pub文件

  2. c++ primer 9 顺序容器

    定义: #include <vector> #include <list> #include <deque> vector<int> svec; lis ...

  3. 在linux通过kubeadm搭建kubernetes群集

    kubeadm是一个命令行的工具,它简化了创建和管理kubernetes cluster的步骤.kubeadm利用Docker的功能进行快速的部署,支行kubernetes master和etcd服务 ...

  4. 修改input中的placeholder属性的颜色

    input::-webkit-input-placeholder{ color:#e8e8e8; } input::-moz-placeholder{ /* Mozilla Firefox 19+ * ...

  5. 【转载】Xutils3-Dbutils

    Github源码地址:https://github.com/wyouflf/xUtils3 下面是源码中sample关于Dbutils的使用代码: import android.view.View; ...

  6. SCU 4441 Necklace

    最长上升子序列,枚举. 因为$10000$最多只有$10$个,所以可以枚举采用哪一个$10000$,因为是一个环,所以每次枚举到一个$10000$,可以把这个移到最后,然后算从前往后的$LIS$和从后 ...

  7. 洛谷P1503 鬼子进村 [平衡树，STL]

    题目传送门 鬼子进村 题目背景 小卡正在新家的客厅中看电视.电视里正在播放放了千八百次依旧重播的<亮剑>,剧中李云龙带领的独立团在一个县城遇到了一个鬼子小队,于是独立团与鬼子展开游击战. ...

  8. 洛谷P3834 [模板]可持久化线段树1（主席树） [主席树]

    题目传送门 可持久化线段树1(主席树) 题目背景 这是个非常经典的主席树入门题——静态区间第K小 数据已经过加强,请使用主席树.同时请注意常数优化 题目描述 如题,给定N个正整数构成的序列,将对于指定 ...

  9. java 接口 继承 接口 抽象类 继承 实体类

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha 接口 可以 继承 接口 抽象类 可以 实现 接口 抽象类 继承实体类 需要 实体类 有 ...

  10. js使用s:property标签接收json格式数据

    js使用s:property接收json数据时,会出现字符被转译的错误. 错误如下: 引号会被转译成'"'字符,导致解析不了. 错误原因: html的s:property接收不会出错,而js ...