Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/80.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 下载HTML表格colspan和rowspan未拾取_Javascript_Jquery_Html - Fatal编程技术网

Javascript 下载HTML表格colspan和rowspan未拾取

Javascript 下载HTML表格colspan和rowspan未拾取,javascript,jquery,html,Javascript,Jquery,Html,我有以下HTML表格: <a href="#" id ="download" role='button' class="button">Download</a> <div id="dvData" class="table-responsive"> <table class="table table-bordered" id="example"> <thead> <tr>

我有以下HTML表格:

<a href="#" id ="download" role='button' class="button">Download</a>
<div id="dvData" class="table-responsive">
    <table class="table table-bordered" id="example">
        <thead>
        <tr>
            <th rowspan="3">Example</th>
            <th colspan="7">Larger Header</th>
        </tr>
        <tr class="table_headers">
            <th colspan="3">Sub Header 1</th>
            <th colspan="3">Sub Header 2</th>
            <th rowspan="2" class="align-middle">Sub Header 3</th>
        </tr>
        <tr class="table_headers">
            <th>Sub sub header</th>
            <th>Sub sub header</th>
            <th>Sub sub header</th>
            <th>Sub sub header</th>
            <th>Sub sub header</th>
            <th>Sub sub header</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td> Info</td>
            <td> Info</td>
            <td> Info</td>
            <td> Info</td>
            <td> Info</td>
            <td> Info</td>
            <td> Info</td>
            <td> Info</td>
            <td> Info</td>
            <td> Info</td>
        </tr>
        </tbody>
    </table>
</div>
当我下载文件时,标题会被弄乱。colspan和rowspan属性不保留。我该如何解决这个问题


编辑:这是小提琴

也许它不完全是你想要的,但是可以将它导出到Excel,保留你想要的标题:

检查这个

函数生成EXCEL(el){
var clon=el.clone();
var html=clon.wrap(“”).parent().html();
//如果需要,请添加更多符号。。。
而(html.indexOf('á')!=-1)html=html.replace(/á/g,á;');
而(html.indexOf('é')!=-1)html=html.replace(/é/g,é;');
而(html.indexOf('í')!=-1)html=html.replace(/í/g,í;');
而(html.indexOf('ó')!=-1)html=html.replace(/ó/g,ó;');
而(html.indexOf('ú')!=-1)html=html.replace(/ú/g,ú;');
而(html.indexOf('º')!=-1)html=html.replace(/º/g,º;');
html=html.replace(//g,“”);
window.open('data:application/vnd.ms excel,'+encodeURIComponent(html));
}
$(“#下载”)。单击(函数(事件){
generateExcel($(“#示例”);
});

您能创建一个提琴吗?CSV没有行跨度或列跨度的概念。那么我该如何将标题放在我需要的地方呢?您。。。有创意吗?每列都用逗号分隔,对吗?因此,输入足够多的逗号,使列标题与所需位置大致对齐。在excel打开之前会弹出一个小窗口。我真的很感激这个解决方案,但我正在努力使它尽可能干净。是的,弹出窗口很糟糕,但我使用这个功能,所有的用户都喜欢它。有没有办法避免弹出窗口?我现在使用的方法没有。我找不到任何方法,我尝试了几种方法。我认为唯一的方法是生成本地xlsx,但它太复杂了,无法在JavaScription中实现,csv呢?
function exportTableToCSV($table, filename) {//used to export tables
        var $headers = $table.find('tr:has(th)')
            ,$rows = $table.find('tr:has(td)')
            ,tmpColDelim = String.fromCharCode(11) // vertical tab character
            ,tmpRowDelim = String.fromCharCode(0) // null character
            ,colDelim = '","'
            ,rowDelim = '"\r\n"';

            var csv = '"';
            csv += formatRows($headers.map(grabRow));
            csv += rowDelim;
            csv += formatRows($rows.map(grabRow)) + '"';

            var csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv);

        if (window.navigator.msSaveOrOpenBlob) {
            var blob = new Blob([decodeURIComponent(encodeURI(csv))], {
                type: "text/csv;charset=utf-8;"
            });
            navigator.msSaveBlob(blob, filename);
        } else {
            $(this)
                .attr({
                    'download': filename
                    ,'href': csvData
            });
        }
        function formatRows(rows){
            return rows.get().join(tmpRowDelim)
                .split(tmpRowDelim).join(rowDelim)
                .split(tmpColDelim).join(colDelim);
        }
        function grabRow(i,row){

            var $row = $(row);
            var $cols = $row.find('td'); 
            if(!$cols.length) $cols = $row.find('th');  

            return $cols.map(grabCol)
                        .get().join(tmpColDelim);
        }
        function grabCol(j,col){
            var $col = $(col),
                $text = $col.text();

            return $text.replace('"', '""'); // escape double quotes

        }
    }
$("#download").click(function (event) {
        outputFile = "example.csv"
        exportTableToCSV.apply(this, [$('#dvData > table'), outputFile]);
    });
function generateExcel(el) {
    var clon = el.clone();
    var html = clon.wrap('<div>').parent().html();

    //add more symbols if needed...
    while (html.indexOf('á') != -1) html = html.replace(/á/g, '&aacute;');
    while (html.indexOf('é') != -1) html = html.replace(/é/g, '&eacute;');
    while (html.indexOf('í') != -1) html = html.replace(/í/g, '&iacute;');
    while (html.indexOf('ó') != -1) html = html.replace(/ó/g, '&oacute;');
    while (html.indexOf('ú') != -1) html = html.replace(/ú/g, '&uacute;');
    while (html.indexOf('º') != -1) html = html.replace(/º/g, '&ordm;');
    html = html.replace(/<td>/g, "<td>&nbsp;");

    window.open('data:application/vnd.ms-excel,' + encodeURIComponent(html));
}
$("#download").click(function (event) {
    generateExcel($("#example"));
});