HTML表单输入到Javascript数组中

时间:2018-12-17 17:02:45

标签: javascript html html5

我的目标是在html文本表单中输入一个名称。每次我按提交

它将将该值存储到javascript数组中。目前,我能够 我提交给数组的第一个值,但不提交后续值。希望我是 足够清楚,任何帮助都会很棒。

这是我的JavaScript

function getListOfNames() {
 "use strict";

  //Declare variables
  var form;
  var getNameValue;
  var myArray = [];
  var output;

  //Assign values	
  output = document.getElementById("myTable");
  form = document.getElementById("myForm");
  getNameValue = form.getNameValue.value;

  //Each time form is submited put the new value into array

  myArray.push(getNameValue);

  //output the results 

  output.innerHTML = myArray;
}

function project5Part2() {
  "use strict";

  // Your code goes in here.

   getListOfNames();

  return false;

}



Here is my HTML

<form  id="myForm" action="#"  onsubmit=" return project5Part2();" > 
  <label for="firstName">Enter Name</label> 
  <input type="text" id="enteredName" name="getNameValue"/>
  <input type="submit" value="Enter Name" />
  <input type="reset"  value="Clear form - DO NOT SEND" />
</form>

1 个答案:

答案 0 :(得分:0)

从表单中删除onsubmit。 将input type="submit"更改为常规按钮,然后使用onclick执行JavaScript。

<form id="myForm" action="#" > 
      <label for="firstName">Enter Name</label> 
      <input type="text" id="enteredName" name="getNameValue"/>
      <button type="button" onclick="project5Part2();">Enter Name</button>
      <input type="reset"  value="Clear form - DO NOT SEND" />
    </form>

创建或使用全局数组(如果要保留,则不能包含在方法中)

单击按钮时,请检查文本框的值,如果不为空,则将该值添加到数组中。

var myArray = new Array();
    function project5Part2() {
        var name = document.getElementById('enteredName').value;
        if (!(typeof name === 'undefined') && name!=null && name.trim()!='') {  
            myArray.push(name);
        }
        console.log(myArray);
        document.getElementById('enteredName').value = '';
    }

每次单击按钮将记录阵列的内容。 例如:["albert", "manny", "susan"]

每次添加名称时,都会清除文本框值。