基于JQuery合并内容相同的单元格的代码

Web前端开发经常会遇到制作表单页面或者制作一些表格的效果，比如在同一个单元格中显示相同的内容。一般的方法是在表内设置一个表，但是这种方法会增加页面负担，影响页面加载速度。但是如果DIV写的css样式很难控制，怎么办？让我们用JQuery和他分享一个表格中内容相同的单元格，并在这里和大家分享代码，希望对大家有用。如下：header JQuery代码复制代码如下： script type=' text/JavaScript ' JQuery . fn . row span=function(colidx){//一个由return this . each(function(){ var that；$('tr '，这个)。每个(函数(行){ $('td:eq(' colIdx ')'，this)。过滤器(' :visible ')。每个函数(col) { if (that！=null $(这个)。html()==$(即)。html()) { rowspan=$(即)。attr(' row span ')；if (rowspan==undefined) { $(that)。attr('rowSpan '，1)；rowspan=$(那个)。attr(' row span ')；} row span=Number(row span)1；$(那个)。attr('rowSpan '，row span)；$(这个)。hide()；} else {那=这个；} });});});} $(function() { $("#table1 ")。row span(0)；//传入的参数是对应的列数从0开始，对应的列值$ ("# Table1 ")。为具有相同内容的列输入rowspan (2 );});/script在正文中添加一个表来复制代码，如下所示：正文表id=' table1 '边框=' 1 ' cell padding=' 5 ' cell spacing=' 0 ' width=' 300 px ' trtd 1/TDD 2/TDT 3/TDT 4/TD/Trtd 1/TDT df/TDT 3/TDT ds/TD/tr/table/body ie effect(9500 . 163.com)。

火狐效果

更多的前端开发可以关注UI前端。