繁体   English   中英

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

[英]I want to storage data from html forms. But I want to make it saved to a local file (a text or csv file - for categorization - )

我有一个项目是为了保存我看过的一些电影。 它是一个上市网站。 第 1 部分(条目面板)我将有一个面板,其中包含一个表格,我可以在其中输入电影的规格(名称、类别、演员等)。 然后当我单击提交按钮时,它会将数据保存在本地(在 csv 或 txt 文件中)。 当然,我应该能够将新电影附加到该文件中。 第 2 部分(查看器)在主页面中,我需要将电影视为 HTML 表中的行。 该表将由我保存的文件中的数据填充(我猜将需要 Js 循环)。 如果该主题与我要求的不同,如果有其他方法,请管理我如何搜索。 我想我必须学习 SQL 来存储更复杂的数据。 这是一个简单的网站:

   <!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>

好吧,使用 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);
    }

致电:

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

不过,您需要弄清楚csvContents将如何构建。

我建议你学习 jQuery,因为它很容易修改或创建 HTML/DOM 元素(这是你在这里需要的)。 请注意,这是来自一个绝不是 Web 应用程序专家并且来自不同领域的人。

注意:如果您想附加到文件,您需要权限,而您没有通过浏览器访问系统的权限。 您应该考虑使用数据库。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM