当前位置：文江博客话题详情

是否可以使用任何 HTML5 功能将本地存储导出到 Excel？

发布于 2024-09-11 05:07:54 字数 147 浏览 27 评论 0原文

这个问题类似，但没有强调任何导出的可能性 /em> 数据。想法？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

玻璃人 2024-09-18 05:07:54

我认为您误解了所链接问题的答案，它建议您使用数据 URI 进行导出。

Excel 是一个有点复杂的目标，因为文件格式本身就是二进制的 (或 OOXML）。如果您只想在 Excel 中打开某些内容，那么您可以将更简单的 CSV 导出为数据 URI。以下代码有点粗糙，仅在 Firefox 中进行了测试：

function exportData() {
    var data = '';
    for (var i=1;i<=2;i++) {
        var sep = '';
        for (var j=1;j<=4;j++) {
            data +=  sep + document.getElementById(i + '_' + j).value;
            sep = ',';
        }
        data += '\r\n';
    }
    var exportLink = document.createElement('a');
    exportLink.setAttribute('href', 'data:text/csv;base64,' + window.btoa(data));
    exportLink.appendChild(document.createTextNode('test.csv'));
    document.getElementById('results').appendChild(exportLink);
}

这是页面标记：

<input type="number" id="1_1" value="2">,
<input type="number" id="1_2" value="1">,
<input type="number" id="1_3" value="4">,
<input type="number" id="1_4" value="3">
<br>
<input type="number" id="2_1" value="1">,
<input type="number" id="2_2" value="2">,
<input type="number" id="2_3" value="3">,
<input type="number" id="2_4" value="4">
<br>
<button onclick="exportData()">Export as CSV</button>
<div id="results"></div>

此处演示。单击该按钮您将获得一个链接，单击该链接您将获得一个文件。更改值，再次单击链接，您将获得不同的文件。 Firefox 每次都让我选择 Excel 打开它，但我不知道这是我的配置问题还是一般问题。

_{（来源：boogdesign.com）}

就像我说的，仅在 Firefox 中进行了测试，并且它仅适用于支持数据 URI。您还需要 window.btoa() 函数或实现您自己的 base64 编码器。

I think you're misunderstanding the answer to the question you linked to, it's suggesting you use a Data URI for export.

Excel is a bit of a complicated target to aim for as the file format is itself binary (or OOXML). If you just want something that opens in Excel then you can export the more straightforward CSV as a data URI. The following code is a bit rough and ready and has only been tested in Firefox:

function exportData() {
    var data = '';
    for (var i=1;i<=2;i++) {
        var sep = '';
        for (var j=1;j<=4;j++) {
            data +=  sep + document.getElementById(i + '_' + j).value;
            sep = ',';
        }
        data += '\r\n';
    }
    var exportLink = document.createElement('a');
    exportLink.setAttribute('href', 'data:text/csv;base64,' + window.btoa(data));
    exportLink.appendChild(document.createTextNode('test.csv'));
    document.getElementById('results').appendChild(exportLink);
}

Here's the page markup:

<input type="number" id="1_1" value="2">,
<input type="number" id="1_2" value="1">,
<input type="number" id="1_3" value="4">,
<input type="number" id="1_4" value="3">
<br>
<input type="number" id="2_1" value="1">,
<input type="number" id="2_2" value="2">,
<input type="number" id="2_3" value="3">,
<input type="number" id="2_4" value="4">
<br>
<button onclick="exportData()">Export as CSV</button>
<div id="results"></div>

Demo here. Click the button you get a link, click the link and you get a file. Change the values, click the link again and you get a different file. Firefox made me select Excel every time to open it but I don't know whether that's my configuration or a general issue.

_{(source: boogdesign.com)}

Like I said, only tested in Firefox, and it will only work in browsers which support Data URIs. You also need the window.btoa() function or implement your own base64 encoder.

回复收藏 0 原文