zoukankan      html  css  js  c++  java
  • js 根据数组分组动态生成table(相同项合并)

    <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd">
    <html>
    <head>
    <title> new document </title>
    <script>
    //xxbh:学校编号,bjbh:班级编号,xx:姓名
    var arrjson=[
    {'xxbh':'1001','bjbh':'0801','xx':'李四'},{'xxbh':'1001','bjbh':'0802','xx':'张三'},
    {'xxbh':'1003','bjbh':'0803','xx':'王五'},{'xxbh':'1003','bjbh':'0804','xx':'晶晶'},
    {'xxbh':'1005','bjbh':'0701','xx':'亮亮'},{'xxbh':'1002','bjbh':'0701','xx':'明敏'},
    {'xxbh':'1005','bjbh':'0701','xx':'张灿'},{'xxbh':'1002','bjbh':'0801','xx':'小白'},
    {'xxbh':'1005','bjbh':'0802','xx':'小胖'},{'xxbh':'1002','bjbh':'0901','xx':'小丽'},
    {'xxbh':'1003','bjbh':'0901','xx':'阿宝'},{'xxbh':'1004','bjbh':'0901','xx':'王泰'},
    {'xxbh':'1001','bjbh':'0901','xx':'阿毛'},{'xxbh':'1006','bjbh':'0901','xx':'李铭'},
    {'xxbh':'1005','bjbh':'0901','xx':'阿城'},{'xxbh':'1004','bjbh':'0901','xx':'张晓'},
    {'xxbh':'1006','bjbh':'0901','xx':'小小'},{'xxbh':'1004','bjbh':'0901','xx':'白昼'},
    {'xxbh':'1002','bjbh':'0901','xx':'乐乐'},{'xxbh':'1001','bjbh':'0901','xx':'黎明'}
    ];
    function creatmapbyxxbh(arrjson){
    var xxbhmap={};
    var len = arrjson.length;
    for(var i=0;i<len;i++){

    if(xxbhmap[arrjson[i].xxbh] == undefined){
    var list = [];
    list.push(arrjson[i]);
    xxbhmap[arrjson[i].xxbh] = list;
    }else{
    xxbhmap[arrjson[i].xxbh].push(arrjson[i]);
    }

    }
    var str="<table border='1'><tr><td width='200'>学校编号</td><td width='200'>班级</td><td width='200'>姓名</td></tr>";
    for(var xxbh in xxbhmap){
    var stu = xxbhmap[xxbh];
    alert(stu.length);
    str+="<tr><td rowspan='"+stu.length+"'>"+xxbh+"</td>";
    for(var i = 0;i < stu.length;i++){
    //document.write(xxbh + " "+stu[i].bjbh+" "+stu[i].xx +"<br />")
    //document.write("<table><tr><td>学校编号</td><td>班级</td><td>姓名</td></tr></table> ")
    if(i==0){
    str+="<td>"+stu[i].bjbh+"</td><td>"+stu[i].xx+"</td></tr>";
    }else{
    str+="<tr><td>"+stu[i].bjbh+"</td><td>"+stu[i].xx+"</td></tr>";
    }
    }
    str+="<tr ><td colspan='3'>"+xxbh+"共有"+stu.length+"个班级</td></tr>"
    }
    str+="</table> ";
    document.write(str)
    }
    </script>
    </head >
    <body>
    <button onclick='creatmapbyxxbh(arrjson)'>测试</button>
    </body>
    </html>

  • 相关阅读:
    java.lang.ExceptionInInitializerError异常分析
    项目中碰到的ExceptionInInitializerError异常
    获取全局上下文(getApplicationContext)_创建Shared Preference工具类_实现自动登录
    IntelliJ Idea 常用快捷键列表
    Qt 创建圆角、无边框、有阴影、可拖动的窗口 good
    去掉 Windows 中控件的虚线框(当当 element == QStyle::PE_FrameFocusRect 时,直接返回,不绘制虚线框)
    Qt 显示 GIF
    C++ 查看预处理后的源文件(查看真实代码)
    数据库访问工具 DBUtl(公孙二狗)
    Tornado
  • 原文地址:https://www.cnblogs.com/yangpeng-jingjing/p/6650413.html
Copyright © 2011-2022 走看看