用Javascript合并指定表格相同文本的相邻单元格

转载 2011年09月20日 10:40:25
 <html>
<head>
<title>Insert title here</title>
<script language="javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
//函数说明:合并指定表格(表格id为_w_table_id)指定列(列数为_w_table_colnum)的相同文本的相邻单元格
//参数说明:_w_table_id 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #data
//参数说明:_w_table_colnum 为需要合并单元格的所在列。为数字,从最左边第一列为1开始算起。
function _w_table_rowspan(_w_table_id,_w_table_colnum){
    _w_table_firsttd = "";
    _w_table_currenttd = "";
    _w_table_SpanNum = 0;
    _w_table_Obj = $(_w_table_id + " tr td:nth-child(" + _w_table_colnum + ")");
    _w_table_Obj.each(function(i){
        if(i==0){
            _w_table_firsttd = $(this);
            _w_table_SpanNum = 1;
        }else{
            _w_table_currenttd = $(this);
            if(_w_table_firsttd.text()==_w_table_currenttd.text()){
                _w_table_SpanNum++;
                _w_table_currenttd.hide(); //remove();
                _w_table_firsttd.attr("rowSpan",_w_table_SpanNum);
            }else{
                _w_table_firsttd = $(this);
                _w_table_SpanNum = 1;
            }
        }
    });
}

//函数说明:合并指定表格(表格id为_w_table_id)指定行(行数为_w_table_rownum)的相同文本的相邻单元格
//参数说明:_w_table_id 为需要进行合并单元格的表格id。如在HTMl中指定表格 id="data" ,此参数应为 #data
//参数说明:_w_table_rownum 为需要合并单元格的所在行。其参数形式请参考jQuery中nth-child的参数。
//          如果为数字,则从最左边第一行为1开始算起。
//          "even" 表示偶数行
//          "odd" 表示奇数行
//          "3n+1" 表示的行数为1、4、7、10.......
//参数说明:_w_table_maxcolnum 为指定行中单元格对应的最大列数,列数大于这个数值的单元格将不进行比较合并。
//          此参数可以为空,为空则指定行的所有单元格要进行比较合并。
function _w_table_colspan(_w_table_id,_w_table_rownum,_w_table_maxcolnum){
    if(_w_table_maxcolnum == void 0){_w_table_maxcolnum=0;}
    _w_table_firsttd = "";
    _w_table_currenttd = "";
    _w_table_SpanNum = 0;
    $(_w_table_id + " tr:nth-child(" + _w_table_rownum + ")").each(function(i){
        _w_table_Obj = $(this).children();
        _w_table_Obj.each(function(i){
            if(i==0){
                _w_table_firsttd = $(this);
                _w_table_SpanNum = 1;
            }else if((_w_table_maxcolnum>0)&&(i>_w_table_maxcolnum)){
                return "";
            }else{
                _w_table_currenttd = $(this);
                if(_w_table_firsttd.text()==_w_table_currenttd.text()){
                    _w_table_SpanNum++;
                    _w_table_currenttd.hide(); //remove();
                    _w_table_firsttd.attr("colSpan",_w_table_SpanNum);
                }else{
                    _w_table_firsttd = $(this);
                    _w_table_SpanNum = 1;
                }
            }
        });
    });
}


$(document).ready(function(){
 _w_table_rowspan("#spdata",2);
 _w_table_rowspan("#spdata",1);
});
</script>

</head>
<body>
  <s:form action="RoleUserAction!add.action">
     备注<s:textfield name="auRoleuser.remark" value="10000"></s:textfield>
     <s:submit label="提交"></s:submit>
    </s:form>
    <br/>
<table id="spdata" style="table-layout:fixed;empty-cells:show;margin:0 auto;border-collapse: collapse;border:1px solid #cad9ea;margin:auto;" border="1">
<thead style="background-color:#CFE4F5;">
<tr>
<th style="width: 9%;">地区</th><th style="width: 5%;">地区</th><th style="width: 12%;">商品代码</th><th style="width: 12%;">商品名称</th><th style="width: 6%;">数量</th><th style="width: 10%;">有效期至</th><th style="width: 14%;">距效期(月)</th><th style="width: 10%;">产品批号</th><th style="width: 6%;">规格</th><th style="width: 6%;">单位</th><th style="width: 10%;">条形码</th>
</tr>
</thead>
<tbody>
<tr>
<td>广东</td>
<td>深圳</td>
<td>00028</td>
<td>红花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>广东</td>
<td>深圳</td>
<td>00028</td>
<td>红花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>广东</td>
<td>深圳</td>
<td>00028</td>
<td>红花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>广东</td>
<td>广州</td>
<td>00027</td>
<td>白花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>广东</td>
<td>广州</td>
<td>00028</td>
<td>红花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>广东</td>
<td>深圳</td>
<td>00028</td>
<td>红花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>广东</td>
<td>深圳</td>
<td>00028</td>
<td>红花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>广东</td>
<td>深圳</td>
<td>00028</td>
<td>红花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>广东</td>
<td>深圳</td>
<td>00028</td>
<td>红花油</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</tbody>
</table>


</body>
</html>

相关文章推荐

jquery合并表格中相同文本的相邻单元格

这篇文章主要介绍了jquery合并表格中相同文本的相邻单元格的相关资料,需要的朋友可以参考下 一、效果 二、代码 Example ...

用jQuery合并表格中相同文本的相邻单元格

本文转自http://www.cnblogs.com/ly5201314/archive/2009/08/13/1545116.html 已经生成的数据表格大致内容如下: ...

用jQuery合并表格中相同文本的相邻单元格

1、在html的head中引入jQuery     2、添加合并单元格的函数     //函数说明:合并指定表格(表格id为_w_table_id)指定列(列数为_w_table_colnum)的相同...

jquery合并表格中相同文本的相邻单元格

随笔 - 218  文章 - 0  评论 - 317 使用jquery合并表格中相同文本的相邻单元格 一、效果 二、代码 ...

Javascript合并表格中具有相同内容单元格示例

 效果图:   HTML代码: 复制代码 代码如下: 表格相同内容合并 合并前: a 1 2 3 4 ...

Javascript合并表格相同内容单元格示例

效果图: HTML代码: 表格相同内容合并 合并前: a 1 2 3 4 5 a 1 2 ...

excel将某列内容相同的相邻单元格合并

#新建宏执行下列代码,是合并B列的 Sub test() Dim Rng As Range, Dic As Object, Arr, N& Set Dic = CreateObject("s...
  • zyz1985
  • zyz1985
  • 2011年10月17日 16:41
  • 4119

jquery 合并相邻且内容相同单元格

公用的方法: 1. //合并内容相同单元格 2. function mergeTableCell(table_id, table_colnum) { 3. _w_ta...
  • freellf
  • freellf
  • 2013年10月21日 00:08
  • 1296

使用VBA实现Excel合并相同内容的相邻单元格

写算法的数据分析时生成了csv文件,为了方便查看需要对部分单元格进行合并。 原始的CSV文件用Excel打开有大量如下形式的子表: 而我希望处理之后变成如下格式: 在网上搜索了很久,大多只能对...

JQuery实现表格的相同单元格合并的三种方法

代码: merge.html function merge1(){ ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:用Javascript合并指定表格相同文本的相邻单元格
举报原因:
原因补充:

(最多只允许输入30个字)