JavaScript - 將HTML表格數據導出到Excel中

我試圖將HTML表格轉換爲Excel，我嘗試使用將簡單表格轉換爲Excel的JavaScript函數，它工作正常。如果我有多個表格，我將如何將所有表格數據添加到Excel文件中。這是我的嘗試。我創建了2個表格並給出了表格索引testTable和testTable1。JavaScript - 將HTML表格數據導出到Excel中

如何通過點擊按鈕將這兩個表ID傳遞給JavaScript函數？現在點擊按鈕只有第一個表格被導出到Excel，因爲我只通過'testTable'。我將如何能夠導出多個表，例如：testTable,testTable1到Excel中？

這裏的JavaScript的：

<script> 

var tableToExcel = (function() { 
var uri = 'data:application/vnd.ms-excel;base64,' 
, template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]>  
<xml> 
<x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet} 
</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions> 
</x:ExcelWorksheet></x:ExcelWorksheets> 
</x:ExcelWorkbook> 
</xml> 
<![endif]--> 
</head> 
<body> 
<table>{table}</table></body></html>' 
, base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) } 
, format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) } 
return function(table, name) { 
if (!table.nodeType) table = document.getElementById(table) 
var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML} 
window.location.href = uri + base64(format(template, ctx)) 
} 
})() 

</script>

這裏的HTML部分，

<table id="testTable"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>ACP</th> 
      <th>OEMCP</th> 
      <th>Unix<br> 
       NT 3.1</th> 
      <th>Unix<br> 
       NT 3.51</th> 
      <th>Unix<br> 
       95</th> 
     </tr> 
    </thead> 
</table> 
<table id="testTable1"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>ACP</th> 
      <th>OEMCP</th> 
      <th>Windows<br> 
       NT 3.1</th> 
      <th>Windows<br> 
       NT 3.51</th> 
      <th>Windows<br> 
       95</th> 
     </tr> 
    </thead> 
</table>

請讓我知道，這可怎麼辦呢？
感謝

來源

2013-03-05 shockwave

不能使用Web服務這個問題。它也將工作，無需回傳。 – osmanraifgunes 2013-03-05 12:50:24

我推薦另一種格式的方法。 John Resig微模板是一款非常好的簡單工具，可以滿足您的需求。（ejohn microtemplating）

(function(){ 
    var cache = {}; 

    this.tmpl = function tmpl(str, data){ 
    // Figure out if we're getting a template, or if we need to 
    // load the template - and be sure to cache the result. 
    var fn = !/\W/.test(str) ? 
     cache[str] = cache[str] || 
     tmpl(document.getElementById(str).innerHTML) : 

     // Generate a reusable function that will serve as a template 
     // generator (and which will be cached). 
     new Function("obj", 
     "var p=[],print=function(){p.push.apply(p,arguments);};" + 

     // Introduce the data as local variables using with(){} 
     "with(obj){p.push('" + 

     // Convert the template into pure JavaScript 
     str.replace(/[\r\t\n]/g, " ") 
       .split("{{").join("\t") 
       .replace(/((^|}})[^\t]*)'/g, "$1\r") 
       .replace(/\t=(.*?)}}/g, "',$1,'") 
       .split("\t").join("');") 
       .split("}}").join("p.push('") 
       .split("\r").join("\\'") 
       + "');}return p.join('');"); 

    // Provide some basic currying to the user 
    return data ? fn(data) : fn; 
    }; 
})();

它的使用非常簡單。這不僅允許在HTML之間顯示變量，還可以執行JavaScript代碼

您的模板字符串需要修改才能使用此微模板。

{{for(var i=0; i<tables.length;i++){ }} 
    <table> 
     {{=tables[i]}} 
    </table> 
{{ } }}

最後只需要選擇出現在您的例子中，所有表

document.getElementsByTagName("table");

你可以看到它是如何工作http://jsfiddle.net/Scipion/P8rpn/1/

來源

2013-03-05 15:05:13 Scipion

感謝噸Scipion！我只是想知道如果我可以通過點擊一個html按鈕來實現這個功能...我試過這個但這是行不通的....它如何在jsFiddle上工作？如果我在html中實現相同的功能，則無法單擊該按鈕來獲取文件。請讓我知道這是否可能。 – shockwave 2013-03-09 18:57:08

嘗試併爲其添加單擊事件。函數下載（）{ tableToExcel（document.getElementsByTagName（「table」），「one」）; } var btn = document.getElementById（「btn」）; btn.addEventListener（「click」，download）; http://jsfiddle.net/Scipion/P8rpn/3/ – Scipion 2013-03-11 11:09:15

非常感謝！這工作就像一個魅力！ :) – shockwave 2013-03-12 18:04:29

創建函數和TABLEID傳遞給它

function passing_id_to_excel(tableID){ 
    var myTableid = 
document.getElementById(tableID) //remaining code }

來源

2013-03-05 13:46:27 divyabharathi

我將如何傳遞多個tableID？ – shockwave 2013-03-05 13:50:29

添加一個複選框爲每個表。使用JavaScript來處理那些被檢查的。
如果你只是想轉換每個表，你可以使用$('table').each(function() { do something })。

來源

2013-03-07 21:14:00 gongzhitaao

檢查我的答案在這裏： -

Export html table data to Excel using JavaScript/JQuery is not working properly in chrome browse

來源

2014-11-27 18:12:21 sampopes

JavaScript - 將HTML表格數據導出到Excel中

回答

相關問題