0

我在 HTML 表中有大约 5000 行（tr），每行有 10 列（td）。现在我正在尝试使用以下 jQuery 代码将整个 HTML 表导出到 excel：

var test = $('#data');
window.open('data:application/vnd.ms-excel,' + encodeURIComponent(test.html()));

还尝试了许多其他 jQuery 插件，如 DataTables.net、jqWidgets 和 jqGrid，但每次我的浏览器崩溃并且必须重新加载页面。

4

4 回答 4

1

window.open()的范围和限制已在这篇文章中得到很好的解释：Export to CSV using jQuery and html

出于您的考虑，我测试了 2500 行，效果很好。（我无法在 jsfiddler 上上传这么多数据，但我相信它也适用于 5000 行。）

另外，我怀疑您是否将 html 表包装到容器 DIV 中。只需将您的 html 表放入 DIV 并像这样使用 -

$("[id$=myButtonControlID]").click(function(e) {
    window.open('data:application/vnd.ms-excel,' + encodeURIComponent( $('div[id$=divTableDataHolder]').html()));
    e.preventDefault();   });

http://jsfiddle.net/AnilAwadh/wJyWm/

encodeURIComponent()是一个 Javascript 函数，用于对特殊字符进行编码（如果您的数据有）并且它的使用是可选的。

于 2013-07-18T16:25:31.373 回答
0

如果您的目标是非 IE 浏览器，请尝试以下操作：

var test = $('#data');
window.open('data:application/vnd.ms-excel,' + 
            encodeURIComponent(test[0].outerHTML));

使用 Chrome 在这里查看它的工作原理：http: //jsfiddle.net/56tvb/2/。

如果您将Internet Explorer定位为浏览器，则必须寻找不同的方法，因为当前的方法不起作用。从 MSDN 库中，数据协议主题说：

仅以下元素和/或属性支持数据 URI。

object (images only)
img
input type=image
link
CSS declarations that accept a URL, such as background, backgroundImage, 
and so on.

数据 URI 可以嵌套。

出于安全原因，数据 URI 仅限于下载的资源。数据 URI 不能用于导航、脚本或填充框架或 iframe 元素。

于 2013-07-19T14:38:19.923 回答
0

我的朋友建议使用这种方法 - 尝试创建一个 blob 并使用 navigator.msSaveBlob() 或 navigator。msSaveOrOpenBlob() 。

    var csvContent=data; 
    var blob = new Blob([csvContent],{
        type: "text/csv;charset=utf-8;",
    });

    navigator.msSaveBlob(blob, "filename.csv") 
//or navigator. msSaveOrOpenBlob(blob, "filename.csv")

msdn.microsoft.com/en-us/library/ie/hh772331(v=vs.85).aspx

于 2013-11-27T17:02:26.303 回答
0

你可以试试这个插件 - tableExport.js

HTML：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="src/jquery.table2excel.js"></script>
<body>
<tr class="noExl">
  <th>#</th>
  <th>Column heading</th>
  <th>Column heading</th>
  <th>Column heading</th>
</tr>
</body>

jQuery：

$("button").click(function(){
  $("#table2excel").table2excel({
    // exclude CSS class
    exclude: ".noExl",
    name: "Excel Document Name"
  });
});

插件下载： http ://www.jqueryscript.net/table/Export-Html-Table-To-Excel-Spreadsheet-using-jQuery-table2excel.html

于 2015-11-23T08:48:59.260 回答