JQuery实现table行折叠效果以JSON做数据源

2020-05-22 17:07:31易采站长站整理


<!DOCTYPE html>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head runat=”server”>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title></title>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js”></script>
<script type=”text/javascript”>
Array.prototype.filterRepeat = function () {
var res = [], hash = {};
for (var i = 0, elem; (elem = this[i]) != null; i++) {
if (!hash[elem]) {
res.push(elem);
hash[elem] = true;
}
}
return res;
}
$(function () {
var json = [
{ “SysName”: “数据库”, “SysGuid”: “1”, “CourseName”: “SQL”, “CourseGuid”: “22”, “Remarks”: “大sb”, “firstdate”: “2013-1-1”, “firstresult”: “合格”, “secdate”: “2013-2-1”, “secresult”: “合格”, “thirddate”: “2013-3-1”, “thirdresult”: “合格” },
{ “SysName”: “数据库”, “SysGuid”: “1”, “CourseName”: “MySQL”, “CourseGuid”: “23”, “Remarks”: “IQ太低”, “firstdate”: “2013-1-1”, “firstresult”: “不合格”, “secdate”: “2013-2-1”, “secresult”: “不合格”, “thirddate”: “2013-3-1”, “thirdresult”: “合格” },
{ “SysName”: “数据库”, “SysGuid”: “1”, “CourseName”: “NoSQL”, “CourseGuid”: “24”, “Remarks”: “IQ太低”, “firstdate”: “2013-1-1”, “firstresult”: “不合格”, “secdate”: “2013-2-1”, “secresult”: “合格”, “thirddate”: “2013-3-1”, “thirdresult”: “合格” },
{ “SysName”: “数据库”, “SysGuid”: “1”, “CourseName”: “Oracle”, “CourseGuid”: “25”, “Remarks”: “IQ太低”, “firstdate”: “2013-1-1”, “firstresult”: “不合格”, “secdate”: “2013-2-1”, “secresult”: “合格”, “thirddate”: “2013-3-1”, “thirdresult”: “合格” },
{ “SysName”: “ASP.NET”, “SysGuid”: “2”, “CourseName”: “基础”, “CourseGuid”: “43”, “Remarks”: “IQ太低”, “firstdate”: “2013-1-1”, “firstresult”: “合格”, “secdate”: “2013-2-1”, “secresult”: “不合格”, “thirddate”: “2013-3-1”, “thirdresult”: “合格” },