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

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

公用的方法:

//合并内容相同单元格
function mergeTableCell(table_id, table_colnum) {
	_w_table_firsttd = "";
	_w_table_currenttd = "";
	_w_table_SpanNum = 0;
	_w_table_Obj = $("#" + table_id + " tr td:nth-child(" + 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();
				_w_table_firsttd.attr("rowSpan", _w_table_SpanNum);
			} else {
				_w_table_firsttd = $(this);
				_w_table_SpanNum = 1;
			}
		}
	});
}

使用方法:

在jsp页面中调用如下代码段:

 <script type="text/javascript">
//第一个参数代表table的ID,第二个参数表示要合并的列,从1开始
						 mergeTableCell("powergrid",1);
</script>

 

 

 

合并列的公用方法:

function mergeTableRow(id,row,hide){

  var tds=$("#"+id).find("tr").eq(row-1).children();

  var first=null;

  var colspan=-1;

  var current=null;

  tds.each(function(i){

    if(i==0){

      first=$(this);

      colspan=1;

    }else{

      current=$(this);

      if(first.text()==current.text()){

      colspan++;

      if(hide)

       current.hide();

      else

       current.remove();

      first.attr("colspan",colspan);

      }else{

        first=$(this);

        colspan=1;

      }

    }

  })

}

使用方法:

在body中调用如下方法:

<script type="text/javascript"> 
  try
  {
	  mergeTableRow("summaryTable",2,false);
	  mergeTableRow("summaryTable",1,false);
	
	  var len=800+300*(${fn:length(taskItemList)}*1);
	  $("#summaryTable").css("width",len+"px");
  }
  catch(e)
  {
  }  
</script>