如何在 Javascript 中将文本框中的输入存储在数组中

How to store inputs from a textbox in array in Javascript

本文关键字：输入 存储 数组 Javascript 文本      更新时间：2023-09-26

<!DOCTYPE html>
<html>
<head>
<form id="form1">
Beets:<input id="number1" type="integer" size = "5">
Artichokes: <input id="number2" type="integer" size = "5">
Carrots: <input id="number3" type="integer" size = "5">
</form>
<button id = "submitButton" onclick="RunApp()" > Submit</button>
<button id = "displayButton" onclick="getAllValues()" > Display</button>
<script>
var str = "";
 function getAllValues() {
     var input1, inputs;
	 input1 = document.getElementById("form1");
	 inputs = input1.elements["number1"].value;
     for (i = 0; i < inputs.length; i++) {
         str += inputs[i].value + "  ";
     }
     alert(str);
 }
function RunApp()
{
var beets, artichokes, carrots, input1, input2, input3;
// getting inputs into variables
input1 = document.getElementById("form1");
beets = input1.elements["number1"].value;
input2 = document.getElementById("form1");
artichokes = input1.elements["number2"].value;
input3 = document.getElementById("form1");
carrots = input1.elements["number3"].value;

if (beets == "" || carrots == "" || artichokes == "" || isNaN(beets) || isNaN(carrots) || isNaN(artichokes))
{
    document.getElementById("demo").innerHTML+= "not valid" + "<br>";
    document.getElementById("demo").innerHTML+= "--------------------------" + "<br>";
}
else
{
document.getElementById("demo").innerHTML+= "Beets = " + beets + "<br>";    document.getElementById("demo").innerHTML+= "Artichokes = " + artichokes + "<br>";
document.getElementById("demo").innerHTML+= "Carrots = " + carrots + "<br>";
}
}

</script>
<p id="demo"></p>
</head>
<body>
</body>
</html>

首先，这是我第一次学习JS。

因此，我有一个文本框，一个提交按钮和一个显示按钮。当我在文本框中输入数字并单击提交时，它会显示该数字。我输入我的第二个号码，然后单击提交按钮显示第二个号码。然后我单击显示按钮，它将按顺序显示数字 1 和数字 2。如果我在文本框中有更多输入，显示按钮将显示数组中所有输入的完整列表。

谢谢！

好吧，既然这是你的第一次，而且你正在学习，我不会给你答案，但我会为你指出正确的方向。

您希望在提交按钮上附加单击事件以将值添加到数组，然后在单击显示按钮时打印数组。

我认为首先你必须谷歌这个。我写了一些东西，你可以改进这一点。我只想举一个例子。

.HTML：

<input type="text" id="inputbox">
<br/>
<button type="button" id="submit">Submit</button>
<button type="button" id="display">Display</button>
<br/>
<div id="screen"></div>

.JS：

var inputArray = [];
var input = document.getElementById('inputbox');
var screen = document.getElementById('screen');
document.getElementById('submit').onclick = function () {
    inputArray.push(input.value);
    screen.innerHTML = input.value;
};
document.getElementById('display').onclick = function () {
    screen.innerHTML = inputArray
};

http://jsfiddle.net/y9wL27y0/

相关文章：