jQuery Datatables导出CSV仅获第二行表头，需导出多行表头

Datatables默认的CSV导出只会抓取<thead>中最后一行的表头，要导出完整的多行表头，需要自定义CSV按钮的表头生成逻辑，手动处理合并单元格（rowspan/colspan）的映射关系。

修改后的Buttons配置 #

buttons: [{
    extend: 'CSV',
    header: function() {
        var headers = [];
        // 获取thead下的所有表头行
        var headerRows = $('#example thead tr');
        
        // 处理第一行表头：根据colspan拆分合并项，对齐第二行列数
        var firstRow = [];
        $(headerRows[0]).find('th').each(function() {
            var colspan = $(this).attr('colspan') || 1;
            var text = $(this).text().trim();
            // 按colspan重复表头文本，匹配下方子列数量
            for (var i = 0; i < colspan; i++) {
                firstRow.push(text);
            }
        });
        headers.push(firstRow.join(','));
        
        // 处理第二行表头：直接提取每个列的文本
        var secondRow = [];
        $(headerRows[1]).find('th').each(function() {
            secondRow.push($(this).text().trim());
        });
        headers.push(secondRow.join(','));
        
        // 返回两行表头，用换行符分隔
        return headers.join('\n');
    },
    fieldSeparator: ','
}, {
    extend: 'print',
    header: true,
    // 打印时强制保留原多行表头结构
    customize: function(win) {
        $(win.document.body).find('table thead').html($('#example thead').html());
    }
}],

逻辑说明 #

• 自定义header函数遍历两行表头：第一行根据colspan拆分合并项，让表头文本数量和第二行列数对齐；第二行直接提取各列文本，最后将两行用换行符拼接作为CSV表头。
• 打印按钮通过customize方法，强制复用原表格的多行表头结构，避免打印时丢失第一行表头。

导出后的CSV表头示例：

Sl.No,Zone,Allotted,Allotted,Vacant,Vacant,Amenities,Amenities,Total,Total
No Of Plots,Area,No Of Plots,Area,No Of Plots,Area,No Of Plots,Area

内容的提问来源于stack exchange，提问作者Alok Saroj