您如何将用户输入存储到数组中？

Question

如何将来自的用户输入存储<input type="text">到Javascript数组中？到目前为止，我有：<input type="text" id="user_input"><button type="button>click</button><script>const myArray = [];//what next? I don't mind using console.log to test</script>

Answer 1

首先，您可以使用中的onclick属性<button>，该属性可以在单击按钮时执行功能。

<button type="button" onclick="addData()">click</button>

在您的JavaScript上，您将定义addData（）函数。

const inputData = [];

const addData = () => {

  const inputText = document.getElementById('user_input');

  inputData.push(inputText.value);

}

这是给您的演示：

<input type="text" id="user_input">

<button type="button" onclick="addData()">click</button>

<script>

const inputData = [];

const addData = () => {

  const inputText = document.getElementById('user_input');

  inputData.push(inputText.value);

  console.log(inputData);

}

</script>

Answer 2

如果您的问题是关于在用户单击按钮时将输入添加到数组中，那么就足够了：

<input type="text" id="user_input">

<button type="button" onclick="storeInput()">store input</button>

<script>

const storedUserInputs = [];

function storeInput() {

  var input = document.getElementById("user_input"); // get reference to the input element

  storedUserInputs.push(input.value); // catpure the value

  input.value = ""; //reset the input value

  console.log(storedUserInputs);

}

</script>

Answer 3

意大利面条的解决方案可能如下例所示，

values = [];

function addRecord() {

  var inp = document.getElementById('inputtext');

  values.push(inp.value);

  inp.value = "";  

}

function displayRecord() {

  document.getElementById("values").innerHTML = values.join(", ");

}

 <table>

            <tr>

                <td>Enter the Input</td>

                <td><input type="text" id="inputtext" /></td>

            </tr>

            <tr>

                <td></td>

                <td><button type="button" id="add" onclick="addRecord();">Add </button>

                <button type="button" id="display" onclick="displayRecord();">Display</button>

                </td>

            </tr>

    </table>

   <div id='values'>

</div>