Question

我需要通过单击按钮在我的html页面框架中保存一些表格内容。之后在“另存为”对话框中我想选择一个文件名并将其保存在某处。问题是如何执行此操作。我至少看到两种方式。第一个是服务器端，第二个是客户端。出于某些原因，我更喜欢使用客户端方法。但是怎么做呢？哪种技术更喜欢？当然，它需要支持大多数流行的浏览器。不知何故，我需要向用户显示“另存为”对话框，以允许他/她选择文件位置。

Answer 1

如果我理解您要做的事情，可以尝试将base64编码为数据URL，然后将其设置为Save as的链接值。您可以在Javascript中使用btoa（）本机函数来获取字符串，将其编码为base64，并要求用户右键单击并将链接另存为。

<script LANGUAGE="Javascript">
function initialize(berliner) {
document.getElementById("aharef").href="data:text/plain;base64,"+btoa(berliner);
}
</script>
<a href="javascript:" id="aharef">Just an example link. Right click and save as to save when ready.</a>
<input type="button" value="Get ready." onClick="initialize('I am a jelly donut.');">

Answer 2

<强>短

这在客户端是不可能的。

<强>长：

使用标准HTML5技术，您只能使用File API 读取文件。以编程方式将文件真正保存到用户硬盘的唯一方法是使用Microsoft的ActiveX技术（这很丑陋，仅适用于IE）。

<强>解决方案：

在您的情况下，我建议您提供一个按钮，使您的应用程序创建具有必要格式的文档，并将其作为下载发送给用户。

Answer 3

通过tomysshadow（我赞成）来完善答案：

<script LANGUAGE="Javascript">
  function initialize(txt) {
    document.getElementById("theLink").href="data:text/plain;base64,"+btoa(txt);
  }
</script>
<a 
  id="theLink"
  download="myFile.txt" 
  href="javascript:" 
  onclick="initialize('Here is the contents of the file');" 
>Save</a>

使用此代码，在执行此操作之前无需准备下载。您也无需右键单击并选择“将链接另存为”。您可以在代码中指定文件的名称。我只在Firefox中试过它。

在这里试试https://jsfiddle.net/ad3u85ym/

客户端数据保存到硬盘驱动器

3 个答案: