jquery合并表格

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">

 

<HTML xmlns="http://www.w3.org/1999/xhtml">

<HEAD id="Head1">

<TITLE></TITLE>

<SCRIPT type="text/javascript" src="jquery-1.4.1.js"></SCRIPT>

<SCRIPT type="text/javascript">

        //函数说明:合并指定表格(表格id为table_id)指定列(列数为table_colnum)的相同文本的相邻单元格

        //参数说明:table_id 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="table1" ,此参数应为 #table1

        //参数说明:table_colnum 为需要合并单元格的所在列。为数字,从最左边第一列为1开始算起。

        function table_rowspan(table_id, table_colnum) {

            table_firsttd = "";

            table_currenttd = "";

            table_SpanNum = 0;

            colnum_Obj = $(table_id + " tr td:nth-child(" + table_colnum + ")");

            colnum_Obj.each(function (i) {

                if (i == 0) {

                    table_firsttd = $(this);

                    table_SpanNum = 1;

 

                } else {

                    table_currenttd = $(this);

                    if (table_firsttd.text() == table_currenttd.text()) {

                        table_SpanNum++;

                        table_currenttd.hide(); //remove();

                        table_firsttd.attr("rowSpan", table_SpanNum);

                    } else {

                        table_firsttd = $(this);

                        table_SpanNum = 1;

                    }

                }

            });

        }

        //函数说明:合并指定表格(表格id为table_id)指定行(行数为table_rownum)的相同文本的相邻单元格

        //参数说明:table_id 为需要进行合并单元格的表格id。如在HTMl中指定表格 id="table1" ,此参数应为 #table1

        //参数说明:table_rownum 为需要合并单元格的所在行。其参数形式请参考jQuery中nth-child的参数。

        //          如果为数字,则从最左边第一行为1开始算起。

        //          "even" 表示偶数行

        //          "odd" 表示奇数行

        //          "3n+1" 表示的行数为1、4、7、10.......

        //参数说明:table_maxcolnum 为指定行中单元格对应的最大列数,列数大于这个数值的单元格将不进行比较合并。

        //          此参数可以为空,为空则指定行的所有单元格要进行比较合并。

        function table_colspan(table_id, table_rownum, table_maxcolnum) {

            if (table_maxcolnum == void 0) {

                table_maxcolnum = 0;

            }

            table_firsttd = "";

            table_currenttd = "";

            table_SpanNum = 0;

            $(table_id + " tr:nth-child(" + table_rownum + ")").each(function (i) {

                row_Obj = $(this).children();

                row_Obj.each(function (i) {

                    if (i == 0) {

                        table_firsttd = $(this);

                        table_SpanNum = 1;

                    } else if ((table_maxcolnum > 0) && (i > table_maxcolnum)) {

                        return "";

                    } else {

                        table_currenttd = $(this);

                        if (table_firsttd.text() == table_currenttd.text()) {

                            table_SpanNum++;

                            table_currenttd.hide(); //remove();

                            table_firsttd.attr("colSpan", table_SpanNum);

                        } else {

                            table_firsttd = $(this);

                            table_SpanNum = 1;

                        }

                    }

                });

            });

        }

 

        $(document).ready(function () {

            table_rowspan("#mytable", 1);

            table_colspan("#mytable", 2, null);

            table_colspan("#mytable", 4, null);

        })

 

    </SCRIPT>

 

</HEAD>

<body>

<table id=mytable  border=1 cellspacing=1 cellpadding=1  width="50%"  align=center>

              <tr class=tr_title>

                <td>代理商</td>

                <td>号码段</td>

                <td>卡总数</td>

                <td>售出数</td>

                <td>库存</td></tr>

              <tr>

                <td>望城县城西电信公司</td>

                <td>139</td>

                <td>1</td>

                <td>1</td>

                <td>0</td></tr>

              <tr>

                <td>望城县城西电信公司</td>

                <td>189</td>

                <td>4</td>

                <td>3</td>

                <td>1</td></tr>

              <tr>

                <td>高塘岭电信公司</td>

                <td>135</td>

                <td>1</td>

                <td>1</td>

                <td>0</td></tr>

              <tr>

                <td>高塘岭电信公司</td>

                <td>159</td>

                <td>5</td>

                <td>0</td>

                <td>5</td></tr>

              <tr>

                <td>高塘岭电信公司</td>

                <td>189</td>

                <td>3</td>

                <td>2</td>

                <td>1</td></tr>

                </table>

</body>

</html>

 

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值