導出HTML表到excel使用javascript

Question

我想導出我的HTML表格使用本Gist給出的代碼到Excel。但在導出後，當我打開文件時，它在Excel中顯示演示頁面的html代碼。任何人都可以給出正確的javascript樣本，用於導出html表格到Excel中（應該在Office Calc中打開）。

編輯：附加的圖像截圖。

Answer 1

這裏是我做了一個功能。

加上你不想在Excel中顯示元素「刪除」級。

function exportExcel(id,name){ //<table> id and filename 
    var today = new Date(); 
    var date = ('0'+today.getDate()).slice(-2)+"-"+('0'+(today.getMonth()+1)).slice(-2)+"-"+today.getFullYear(); 

    var file_name = name+"_"+date+".xls"; //filename with current date, change if needed 
    var meta = '<meta http-equiv="content-type" content="text/html; charset=UTF-8" />'; 
    var html = $("#"+id).clone(); 

    html.find('.remove').remove(); //add the 'remove' class on elements you do not want to show in the excel 
    html.find('a').each(function() { //remove links, leave text only 
     var txt = $(this).text(); 
     $(this).after(txt).remove(); 
    }); 
    html.find('input, textarea').each(function() { //replace inputs for their respectives texts 
     var txt = $(this).val().replace(/\r\n|\r|\n/g,"<br>"); 
     $(this).after(txt).remove(); 
    }); 
    html.find('select').each(function() { //replace selects for their selected option text 
     var txt = $(this).find('option:selected').text(); 
     $(this).after(txt).remove(); 
    }); 
    html.find('br').attr('style', "mso-data-placement:same-cell"); //make line breaks show in single cell 
    html = "<table>"+html.html()+"</table>"; 

    var uri = 'data:application/vnd.ms-excel,'+encodeURIComponent(meta+html); 
    var a = $("<a>", {href: uri, download: file_name}); 
    $(a)[0].click(); 
} 

調用它的事件，例如：

$("#export_button").click(function(e){ 
    exportExcel("table_id", "filename"); 
});