Extjs4 grid合并行单元格

最新推荐文章于 2025-06-06 08:43:31 发布

置顶 MrCoffee2019

最新推荐文章于 2025-06-06 08:43:31 发布

阅读量2.3k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： Html Extjs4 文章标签： js extjs4

本文链接：https://blog.youkuaiyun.com/zjk20108023/article/details/52101076

Html 同时被 2 个专栏收录

3 篇文章

订阅专栏

Extjs4

1 篇文章

订阅专栏

本文介绍了一个用于ExtJS4 Grid的函数`spanRows`，该函数用于合并行单元格。通过指定grid、起始行和列，可以实现特定列的行合并。在调用时，需在grid的store加载回调中使用，例如：`spanRows(grid, 1, 2);spanRows(grid, 1, 1);`。注意，若需合并多个列，应从后向前调用方法。" 129888494,18033304,爬虫的合法使用与Python爬虫的优势,"['爬虫', 'Python开发', '网络规范', '编程语言', '数据抓取']

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 function spanRows(grid, row, col) {
            var id = grid.view.getId();
            var viewDiv = document.getElementById(id);
            var tables = viewDiv.getElementsByTagName("table");
            if (tables.length==0) {
                return;
            }
            var trs = tables[0].getElementsByTagName("tr");
            var firstTd = trs[row].getElementsByTagName("td")[col];
            var num = 1;
            for (var i = row; i < trs.length; i++) {
                var tr = trs[i];
                var td = tr.getElementsByTagName("td")[col];
                if (!td) {
                    continue;
                }
                if (td.innerHTML == firstTd.innerHTML) {
                    if (i > row) {
                        num++;
                        firstTd.rowSpan = num;
                        firstTd.style["vertical-align"] = "middle";
                        tr.removeChild(td);
                    }
                }
                else {
                    firstTd = td;
                    num = 1;
                }
            }
        }

上面的代码说明：grid需要合并的grid，row起始行位置（一般从0开始，如果涉及到th，可以直接跳过从1开始），col指定列合并，如果涉及多个列合并，请先从后面一个开始调用方法（比如：我需要合并1和2列，spanRows(grid,1,2);spanRows(grid,1,1);）如果出现差异可以看下页面html,需要先找到table。调用时，请在grid的store.load({callback:function(){ spanRows(grid,1,2);spanRows(grid,1,1); }})