跨浏览器javascript下载功能

Cross browser javascript download function

本文关键字：功能 下载 javascript 浏览器      更新时间：2024-04-22

我正在客户端从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"

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

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

其他网络浏览器，如Firefox，还没有提供这一功能，如果你想让你的下载锚推送下载，你可以调用以下功能（在以前的项目中使用）：

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

（注意八位字节流MIME类型）

"data"变量包含要输出的CSV数据。

希望这能有所帮助。

相关文章：