javascript - 跨浏览器javascript下载功能

Question

我正在客户端从我的 json 响应构建一些内容以显示在 html 表格中。我还有一个下载按钮，点击它应该会将文件保存到本地磁盘。我正在从同一 json 响应动态创建 csvContent。

代码:

<a class="download-page" href="#" onClick="downloadPage();">Download</a>

function downloadPage() {
    window.location.href = 'data:text/csv;charset=UTF-8,'+ encodeURIComponent(csv);
    //window.location.href = "data:text/csv;charset=utf-8," + escape(csv));
    //window.open("data:text/csv;charset=utf-8," + encodeURI(csv))
}

这仅适用于 chrome 10。某些版本的浏览器根本不支持。 IE是个大问题。但我的大多数用户使用 IE 9 和 Fire fox。是否有任何跨浏览器功能可以实现这一点。

示例 CSV 数据:

"Testcase Reports for : jumashan\r\n
 Total Unique Stimuli : 1\r\n
 Total execution time : 0 Days 0 hours 16 minutes\r\n

 Testcase Name, Count (Pass/Fail/Error/Block), Version Number, Execution Time(HH:MM:SS),
 INIT-CHECK,2( 0 / 0 / 0 / 2 ) ,0,0:16:28,

 Testcase Reports for : prabhaa\r\n
 Total Unique Stimuli : 1\r\n
 Total execution time : 0 Days 1 hours 23 minutes\r\n"

Answer 1

您可以通过自己在函数中构建内容来轻松获取内容。

要下载它，只有 Chrome 允许您指定文件名。

其他网络浏览器如 Firefox 尚不提供此功能，如果您希望下载 anchor 推送下载，您可以调用以下函数(在之前的项目中使用):

window.open( "data:application/octet-stream;charset=utf-8,"+escape(data));

(注意 octet-stream MIME 类型)

“数据”变量包含您要输出的 CSV 数据。

希望这对您有所帮助。