我想从 html 表单存储数据。但我想将其保存到本地文件（文本或 csv 文件 - 用于分类 - ）

Question

I have a project which is for saving some films that i watched.我有一个项目是为了保存我看过的一些电影。 Its a listing website.它是一个上市网站。 Part 1# (Entry Panel) I will have a panel which includes a form that i input the film's specifications(name,category,actors etc.).第 1 部分（条目面板）我将有一个面板，其中包含一个表格，我可以在其中输入电影的规格（名称、类别、演员等）。 Then when i click the submit button it will save the data locally (in a csv or txt file).然后当我单击提交按钮时，它会将数据保存在本地（在 csv 或 txt 文件中）。 Of course i should be able to append new films to that file.当然，我应该能够将新电影附加到该文件中。 Part 2# (viewer) And in the main page i need to see the films as lines in a HTML table.第 2 部分（查看器）在主页面中，我需要将电影视为 HTML 表中的行。 The table will be filled by the datas from the file i saved (Js loops will be needed i guess).该表将由我保存的文件中的数据填充（我猜将需要 Js 循环）。 If that topic is different than i ask, if there is another way, please manage me how to search.如果该主题与我要求的不同，如果有其他方法，请管理我如何搜索。 Im thinking that i must learn SQL for more complicated data storages.我想我必须学习 SQL 来存储更复杂的数据。 Here is the simple website:这是一个简单的网站：

   <!DOCTYPE html>
    <html>
    <head>
        <title>Film Lister</title>
    </head>
    <body>
    
    <form>
        <input type="text" name="movie-name">
        <input type="text" name="movie-category">
        <button type="submit">Append the movie to file</button>
    </form>
    
    <table id="showcase">
        <tr class="movie">
            <td class="movie-spec"></td>
            <td class="movie-spec"></td>
        </tr>
        <tr class="movie">
            <td class="movie-spec"></td>
            <td class="movie-spec"></td>
        </tr>
    </table>
    
    <script type="text/javascript">
        
        //The part i need help
    
    </script>
    </body>
    </html>

Answer 1

Well, saving data with JavaScript is fairly easy to achieve:好吧，使用 JavaScript 保存数据相当容易实现：

    // Save as File
    function download(filename, text) {
      var element = document.createElement('a');
      element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
      element.setAttribute('download', filename);

      element.style.display = 'none';
      document.body.appendChild(element);

      element.click();

      document.body.removeChild(element);
    }

Call with:致电：

var csvContents = "1,2,3,4,5";
download("mydata.csv", csvContents);

You will need to figure out how csvContents will be constructed though.不过，您需要弄清楚csvContents将如何构建。

I would advise you to learn jQuery as it is very easy for modifying or creating HTML/DOM elements (which is what you require here).我建议你学习 jQuery，因为它很容易修改或创建 HTML/DOM 元素（这是你在这里需要的）。 Note that this is from someone who is by no means a web application expert and is from a different domain.请注意，这是来自一个绝不是 Web 应用程序专家并且来自不同领域的人。

NOTE: If you want to append to the file, you need permissions, which you don't have over the your system from a browser.注意：如果您想附加到文件，您需要权限，而您没有通过浏览器访问系统的权限。 You should consider using a database.您应该考虑使用数据库。

我想从 html 表单存储数据。但我想将其保存到本地文件（文本或 csv 文件 - 用于分类 - ）

问题描述

1 个解决方案

解决方案1
0 2020-10-08 20:45:26

我想从 html 表单存储数据。 但我想将其保存到本地文件（文本或 csv 文件 - 用于分类 - ）

问题描述

1 个解决方案

解决方案1 0 2020-10-08 20:45:26

我想从 html 表单存储数据。但我想将其保存到本地文件（文本或 csv 文件 - 用于分类 - ）

解决方案1
0 2020-10-08 20:45:26