JS 動態合併 table 行

JS 代碼:javascript

<script type="text/javascript">
     $(document).ready(function() {
        tableRowspan(table1, 7);    // table1:table 標籤自定義的ID;  7:默認合併的最大列數
    })
    
    // 合併(tab: table 自定義ID  maxCol:合併單元格做用到多少列)
    function tableRowspan(tab, maxCol) {
         var val = "",
              count,
              start;      
         for (var col = maxCol - 1; col >= 0; col--) {
             count = 1;
             for (var i = 0; i < tab.rows.length; i++) {
                 if (val == tab.rows[i].cells[col].innerHTML) {
                     count++;
                } else {
                    if (count > 1) {
                        //合併 
                        start = i - count;
                        tab.rows[start].cells[col].rowSpan = count;
                        for (var j = start + 1; j < i; j++) {
                            tab.rows[j].cells[col].style.display = "none";
                        }
                        count = 1;
                    }
                    val = tab.rows[i].cells[col].innerHTML;
                }
            }
         
            if(count > 1 ) { 
                //合併,最後幾行相同的狀況下
                start = i - count;
                tab.rows[start].cells[col].rowSpan = count;
                for (var j = start + 1; j < i; j++) {
                    tab.rows[j].cells[col].style.display = "none";
                }
            }
        }
    }
</script>java

 

PS: 頁面值跟前加隱藏域值可解決層級之間的顯示問題spa

相關文章
相關標籤/搜索