【问题标题】:How to append HTML form data into a doc/txt file with javascript如何使用 javascript 将 HTML 表单数据附加到 doc/txt 文件中
【发布时间】:2020-09-11 21:32:00
【问题描述】:

我有一个包含多个输入和下拉列表的表单,我想将这些数据(继续附加未来的数据)存储到一个文本文件中。我不想使用 PHP 或任何其他语言。

我需要稍后将这些数据取回可能到 excel 中,因此将其存储在 json 中是一种可能的方法。

请指导我如何做到这一点,我是 javascript 的初学者,还建议仅使用 javascript(香草)是否有任何更好的方法。

【问题讨论】:

  • 您好,本网站的工作方式是希望您展示一些您已经尝试过的代码,以便其他人可以给您具体的答案和建议。如果您正在寻找教程,这通常不是正确的地方。我建议参加 stackoverflow.com/tour 的游览。

标签: javascript html json excel forms


【解决方案1】:

您好,我已经为您构建了一个使用 vanilla javascript 的完整工作示例。 在此示例中,有一个包含 3 个字段的表单。和一个提交按钮。 单击提交时,将调用函数句柄提交。 然后使用所需的文本创建一个 blob 文件。 它会自动下载文件。

<html>
    <head>
        <script>
            function makeFile(text) {
                var newFile = new Blob(text.split(), { type: 'text/plain' })
                var newFileUrl = window.URL.createObjectURL(newFile);
                var link = document.getElementById('submit');
                link.href = newFileUrl;
                link.download = true;
            }

            var handleSubmit = () => {
                var field1 = document.getElementById('field1').value
                var field2 = document.getElementById('field2').value
                var field3 = document.getElementById('field3').value

                makeFile(`${field1},${field2},${field3}`);
            }

        </script>
    </head>

    <body>
        <form id="form1">
            <div>
                <span>field1:</span>
                <input type="text" id='field1' />
            </div>
            <div>
                <span>field2:</span>
                <input type="text" id='field2' />
            </div>
            <div>
                <span>field3:</span>
                <input type="text" id='field3' />
            </div>
        </form>
        <a href="#" download id="submit" onclick="handleSubmit()">Submit</a>
    </body>
</html>

【讨论】:

猜你喜欢
  • 1970-01-01
  • 2021-11-18
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多