使用 jquery/javascript 将数据从 html 表单保存到文本文件

Posted 2023-05-07

【中文标题】使用 jquery/javascript 将数据从 html 表单保存到文本文件

【英文标题】：Saving a data from html form to text file with jquery/javascript

【发布时间】：2014-12-10 10:02:19

【问题描述】：

我正在尝试为我的网站创建一个 cmets 选项卡并插入一个 html 表单。

到目前为止，我的表单和 cmets 选项卡已准备就绪。我想创建一个文本文档来存储 HTML 表单输入。

我找不到合适的方法来做到这一点，比如 C++ 的fstream。我用 php 找到了一些代码，但我也不想使用 PHP。

有什么办法吗？

【问题讨论】：

如果您想在服务器上存储来自 HTML 表单的数据，您必须使用以您想使用的任何语言编写的后端。最受欢迎的肯定是 PHP 或者 Python。如果你想使用 javascript，你必须为你的 Apache 编写一个插件（如果没有的话），但我会更关心安全性。

【参考方案1】：

您可以使用 datauri 和锚元素的新 download 属性 (<a>) 来实现它，而无需服务器。随便在文本框中输入一些东西，点击“导出”，看看会发生什么：

var container = document.querySelector('textarea');
var anchor = document.querySelector('a');

anchor.onclick = function() 
    anchor.href = 'data:text/plain;charset=utf-8,' + encodeURIComponent(container.value);
    anchor.download = 'export.txt';
;

<textarea></textarea>
<p><a href="#">Export</a></p>

您可以实现其他类型的文件下载，只需将text/plain 更改为正确的 MIME 类型，并确保您正确编码文件内容。例如，<canvas> 是生成图像的好方法。

【讨论】：

这行得通，谢谢。但是例如，有 10 个人在我的网站上发表了评论，我想如何用一个 .txt 来查看所有的 cmets？当您按下导出时，此代码会导出当前的 .txt，对吧？

@Getdachopa 在这种情况下，您需要获取所有 cmets，格式化和连接，然后获取文本内容，并生成文件。但是，为此我建议您在文本上输出 HTML，因为 HTML 在 CSS 的帮助下可能具有更好的可读性。

如何在没有锚标签的情况下通过按钮使用它

@Prem href 和 download 属性仅适用于 <a> 元素，因此如果没有它，您将无法执行此操作。但是，您可以使 <a> 元素不可见，并在单击 <button> 时调用其 click() 方法 - button.onclick = function() anchor.click(); ;