如何使用jquery或php下載xlsx格式的html表數據

Question

這里我有一個html表我想用xls格式下載數據，我不知道下載，我想使用任何插件或不，

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">

</script>
<script src="jquery.min.js"></script>
<table border="1" id="ReportTable" class="myClass">
    <tr bgcolor="#CCC">
      <td width="100">id</td>
      <td width="700">Name</td>
      <td width="170">Email</td>
      <td width="30">Mobile</td>
    </tr>
    <tr bgcolor="#FFFFFF">
      <td>1</td>
      <td>Kani</td>
      <td>Kani@gmail.com</td>
      <td>9986128665</td>
    </tr>
  </table>

<input type="submit" value="Export to Excel"> 

Answer 1

使用jQuery和html從Export導出到CSV

 $(document).ready(function() { function exportTableToCSV($table, filename) { var $rows = $table.find('tr:has(td)'), // Temporary delimiter characters unlikely to be typed by keyboard // This is to avoid accidentally splitting the actual contents tmpColDelim = String.fromCharCode(11), // vertical tab character tmpRowDelim = String.fromCharCode(0), // null character // actual delimiter characters for CSV format colDelim = '","', rowDelim = '"\\r\\n"', // Grab text from table into CSV formatted string csv = '"' + $rows.map(function(i, row) { var $row = $(row), $cols = $row.find('td'); return $cols.map(function(j, col) { var $col = $(col), text = $col.text(); return text.replace(/"/g, '""'); // escape double quotes }).get().join(tmpColDelim); }).get().join(tmpRowDelim) .split(tmpRowDelim).join(rowDelim) .split(tmpColDelim).join(colDelim) + '"'; // Deliberate 'false', see comment below if (false && window.navigator.msSaveBlob) { var blob = new Blob([decodeURIComponent(csv)], { type: 'text/csv;charset=utf8' }); // Crashes in IE 10, IE 11 and Microsoft Edge // See MS Edge Issue #10396033 // Hence, the deliberate 'false' // This is here just for completeness // Remove the 'false' at your own risk window.navigator.msSaveBlob(blob, filename); } else if (window.Blob && window.URL) { // HTML5 Blob var blob = new Blob([csv], { type: 'text/csv;charset=utf-8' }); var csvUrl = URL.createObjectURL(blob); $(this) .attr({ 'download': filename, 'href': csvUrl }); } else { // Data URI var csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv); $(this) .attr({ 'download': filename, 'href': csvData, 'target': '_blank' }); } } // This must be a hyperlink $(".export").on('click', function(event) { // CSV var args = [$('#dvData>table'), 'export.csv']; exportTableToCSV.apply(this, args); // If CSV, don't do event.preventDefault() or return false // We actually need this to be a typical hyperlink }); }); 

 a.export, a.export:visited { display: inline-block; text-decoration: none; color: #000; background-color: #ddd; border: 1px solid #ccc; padding: 8px; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a href="#" class="export">Export Table data into Excel</a> <div id="dvData"> <table border="1" id="ReportTable" class="myClass"> <tr bgcolor="#CCC"> <td width="100">id</td> <td width="700">Name</td> <td width="170">Email</td> <td width="30">Mobile</td> </tr> <tr bgcolor="#FFFFFF"> <td>1</td> <td>Kani</td> <td>Kani@gmail.com</td> <td>9986128665</td> </tr> </table> </div>