Question

我要保存为Excel的页面上有几个html表。我能够将它们保存为excel，但是问题是我无法并行加载它们，它们只是一个接一个地出现。

这是HTML

<table id="1" style="display: inline-block;">
    <tr><th>Name</th><th>Age</th><th>Country</th></tr>
    <tr><td>Geronimo</td><td>26</td><td>France</td></tr>
    <tr><td>Natalia</td><td>19</td><td>Spain</td></tr>
    <tr><td>Silvia</td><td>32</td><td>Russia</td></tr>
</table>

<table id="2" style="float: left;">
    <tr><th>Pet</th><th>Breed</th><th>Type</th></tr>
    <tr><td>Roscoe</td><td>Pug</td><td>Dog</td></tr>
    <tr><td>Polly</td><td>Parrot</td><td>Bird</td></tr>
    <tr><td>Whiskers</td><td>Calico</td><td>Cat</td></tr>
</table>
<br/>
<table id="3">
    <tr><th>Pet</th><th>Breed</th><th>Type</th></tr>
    <tr><td>Roscoe</td><td>Pug</td><td>Dog</td></tr>
    <tr><td>Polly</td><td>Parrot</td><td>Bird</td></tr>
    <tr><td>Whiskers</td><td>Calico</td><td>Cat</td></tr>
</table>
  <input type="button" id="btnExport" title="excel" value="Export" />

这是客户端脚本

$("#btnExport").click(function () {
    fnExcelReport();
});


function fnExcelReport()
{
    var tab_text = "";
    var tab_text= tab_text + "<table border='2px'><tr bgcolor='#87AFC6'>";
    var textRange; var j=0;
    tab = document.getElementById('1'); // id of table

    for(j = 0 ; j < tab.rows.length ; j++) 
    {     
        tab_text=tab_text+tab.rows[j].innerHTML+"</tr>";
        //tab_text=tab_text+"</tr>";
    }

    tab_text=tab_text+"</table>";

    var tab_text= tab_text + "<table border='2px'><tr bgcolor='#87AFC6'>";
    var textRange; var j=0;
    tab = document.getElementById('2'); // id of table

    for(j = 0 ; j < tab.rows.length ; j++) 
    {     
        tab_text=tab_text+tab.rows[j].innerHTML+"</tr>";
        //tab_text=tab_text+"</tr>";
    }

    tab_text=tab_text+"</table>";


    var ua = window.navigator.userAgent;
    var msie = ua.indexOf("MSIE "); 

    if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer
    {
        txtArea1.document.open("txt/html","replace");
        txtArea1.document.write(tab_text);
        txtArea1.document.close();
        txtArea1.focus(); 
        sa=txtArea1.document.execCommand("SaveAs",true,"Say Thanks to Sumit.xls");
    }  
    else                 //other browser not tested on IE 11
        sa = window.open('data:application/vnd.ms-excel,' + encodeURIComponent(tab_text));  

    return (sa);
}

最后这是小提琴链接 Fiddle

请稍等一下，让我知道如何让UI中并排的表在Excel中以相同的方式出现。

Answer 1

因此，基本上，这可以使用html技巧来实现。添加带有内部td的主表以包含表。

<table> 
   <tr> 
      <td>table 1 code with all the html</td>
      <td>table 2 code with all the html</td>
   </tr>
</table>

保存到Excel时并排加载html表

1 个答案: