如何在javascript数组中存储HTML输入字段中的值？

Question

I would like to know how to store a value from an HTML input field after a button is clicked into a JavaScript array and then how to display that array data to the screen. 我想知道如何在将按钮单击到JavaScript数组中后，如何从HTML输入字段中存储值，然后如何在屏幕上显示该数组数据。

Thank you, below is my html code : 谢谢，下面是我的html代码：

<!DOCTYPE HTML>

<html>
<head>
    <title>Checklist</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
</head>
<body>  

    <input type="text" id="item" placeholder="Enter an item">
    <button id="add">Add Item</button>

</body>
</html>

Answer 1

You can create an array, at click of button , push input type="text" element value to array; 您可以创建一个数组，单击button ，将input type="text"元素值推送到数组； use window.open() data URI of type application/octet-stream to download file. 使用application/octet-stream类型的window.open() data URI下载文件。 To update existing file, you can include <input type="file"> element for user to upload same file which was downloaded, push current input type="text" value to same file, then prompt user to download original file with same name. 要更新现有文件，您可以包含<input type="file">元素，以供用户上传已下载的相同文件，将当前input type="text"值推送到同一文件，然后提示用户下载具有相同名称的原始文件。 Though note, it is user decision to download file. 虽然注意，但是用户决定下载文件。

See also Edit, save, self-modifying HTML document; 另请参见编辑，保存，自修改HTML文档。 format generated HTML, JavaScript 格式生成的HTML，JavaScript

<!DOCTYPE HTML>
<html>
<head>
    <title>Checklist</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
  <script>
    $(function() {
      var input = $(":text");
      var button = $("button");
      var arr = [];
      button.click(function() {
        arr.push(input.val());
        input.val("");
        window.open("data:application/octet-stream," + JSON.stringify(arr));

      })
    })
    </script>
</head>
<body>  

    <input type="text" id="item" name="save" placeholder="Enter an item">
    <button id="add">Add Item</button>

</body>
</html>

plnkr http://plnkr.co/edit/cQZznvyltX46UO1Y0lDG?p=preview plnkr http://plnkr.co/edit/cQZznvyltX46UO1Y0lDG?p=preview

如何在javascript数组中存储HTML输入字段中的值？

问题描述

1 个解决方案

解决方案1
1 已采纳 2016-05-30 23:34:53

如何在javascript数组中存储HTML输入字段中的值？

问题描述

1 个解决方案

解决方案1 1 已采纳 2016-05-30 23:34:53

解决方案1
1 已采纳 2016-05-30 23:34:53