2 sfk1993 sfk1993 于 2016.03.11 10:18 提问

新手问题(在js中实现表格效果)
js

这种表格在js中用循环怎么实现?在HTML中一行一行的敲很累图片说明图片

6个回答

showbo
showbo   Ds   Rxr 2016.03.11 12:07

<script>
    var data = [
        ['星期一上午第1节课', '星期一上午第2节课', '星期一上午第3节课', '星期一上午第4节课', '星期一上午第5节课', '星期一上午第6节课'],
        [],//星期二的依次类推,下面的也是,注意课程位置,没有放个空字符或者false占位
        [],
        [],
        [],
        []];
</script>
<table border="1">
    <tr><th>项目</th><th colspan="5">上课</th><th colspan="2">休息</th></tr>
    <tr><th>星期</th><th>星期一</th><th>星期二</th><th>星期三</th><th>星期四</th><th>星期五</th><th>星期六</th><th>星期日</th></tr>
    <tr><td rowspan="4">上午</td>
    <script>//输出第一节课
            for (var i = 0; i < 6; i++) document.write('<td>'+(data[i][0]||'未安排')+'</td>');
    </script>
    <td rowspan="4">休息</td></tr>
    <script>
        var s = '';
        //输出上午的3节课
        for (var j = 1; j < 4; j++) {
            s += '<tr>';
            for (var i = 0; i < 6; i++) s += '<td>' + (data[i][j] || '未安排') + '</td>';
            s += '</tr>';
        }
        document.write(s);
    </script>
    <tr><td rowspan="2">下午</td>
    <script>
        s = '';
        //输出下午第5节课
        for (var i = 0; i < 6; i++) document.write('<td>' + (data[i][4] || '未安排') + '</td>');
    </script>
    <td rowspan="2">休息</td></tr>
    <script>
        var s = '';
        //输出上午的最后节课
            s += '<tr>';
            for (var i = 0; i < 6; i++) s += '<td>' + (data[i][5] || '未安排') + '</td>';
            s += '</tr>';

        document.write(s);
    </script>
</table>
showbo
showbo   Ds   Rxr 2016.03.11 11:52

你的数据结构呢。。也不是很难,也就8x8的表格,上午,下午,周日这种都有固定的rowspan,colspan了,只需要要循环也就是里面的科目而已

qq_25093755
qq_25093755   2016.03.11 13:33

关于JS中建立表格的话,一种就是一楼的做法,另外一种是直接$("id").append(此处拼接HTML代码,也就是你的要显示的table数据);

qq_25093755
qq_25093755 三楼
接近 2 年之前 回复
qq_19891827
qq_19891827   2016.03.11 10:26

你这个涉及到行列合并的问题,不是很规则的表格,所以用js循环实现不了,要是非得通过js实现的话就很麻烦,不如直接html来的快

curry_du
curry_du   2016.03.11 11:20

一行一行敲吧,也不算太多了,哈哈

Royal_lr
Royal_lr   Ds   Rxr 2016.03.11 13:23

一般是从数据库中取出来的,,

Csdn user default icon
上传中...
上传图片
插入图片