Question

我正在尝试通过表单向数组添加元素。我正在使用unshift（）方法。下面的代码不起作用，我想知道原因。

<form>
<input id="input"> </input>
<input type = "button" id="button"> Click me </input>
</form>


<script>

var input = document.getElementById("input").value;
var button = document.getElementById("button");

var myArray = [];
myArray.unshift(input);



button.onclick = function alerted (){
alert(myArray);
};


</script>

Answer 1

加载页面时，您引用的代码会立即运行。表单字段中没有任何内容，因此其值为''。当您发出警告时，阵列上的默认toString操作将导致''，并且警报将为空白。

您希望运行unshift代码以响应用户事件，例如点击按钮，而不是立即执行。您可以将input设置为元素（从该行移除.value），然后将unshift行转移到您分配给onclick的函数中，从而实现这一点，在那里添加.value：

button.onclick = function alerted (){
    myArray.unshift(input.value);
    alert(myArray);
};

其他说明：

您永远不会写</input>。通常，您根本不会关闭input个标签。如果你正在编写XHTML（你可能不是），你可以将/放在主input标记中，如下所示：<input id="input" />。但同样，您可能不会编写XHTML，只需编写HTML。
input按钮的值（标题）位于其value属性中，而不是开始和结束标记中的内容。（您可以使用button元素的开始和结束标记，而不是input。）

将所有这些放在一起，这是一个极简主义的更新：Live copy | source

<form>
<input id="input"><!-- No ending tag -->
<input type = "button" id="button" value="Click me"><!-- No ending tag, move value where it should be -->
</form>
<script>

var input = document.getElementById("input"); // No .value here
var button = document.getElementById("button");

var myArray = [];

button.onclick = function alerted (){
    myArray.unshift(input.value); // Moved this line, added the .value
    alert(myArray);
};
</script>

Answer 2

DEMO

你需要a）获取点击中的值，b）如果你想要按钮不提交，则返回false。我换成了按钮。替代方案是<input type="button" value="click me" id="button" />

您甚至可能想要清空并将该焦点集中在点击...

上

<form>
<input id="input" type="text"/>
<button id="button"> Click me </button>
</form>


<script>

var input = document.getElementById("input"); // save the object
var button = document.getElementById("button");

var myArray = [];




button.onclick = function alerted (){
    myArray.unshift(input.value); // get the value
    alert(myArray);
    return false;
};


</script>

Answer 3

你没有在onclick函数中获得新值。

试试这个：http://jsfiddle.net/SeqWN/4/

var button = document.getElementById("button");
var i = document.getElementById("input");
var myArray = [];

button.onclick = function alerted (){
  myArray.unshift(i.value);
  alert(myArray);
};

使用unshift（）使用javascript将表单输入添加到数组

3 个答案: