2017-07-25 64 views
2

所以我已经在这里一段时间了,但不知道如何继续。我的代码询问用户名字,姓氏和年龄3人,然后将其显示在表格中。用函数内的提示输入填充数组

<script> 
 
    function person(firstName, lastName, age) { 
 

 
    for (var x = 1; x <= 3; x++) { 
 

 
     this.firstName = prompt("Please enter a first name", ""); 
 
     while (this.firstName == null || this.firstName == "") { 
 
     this.firstName = prompt("Invalid input. Please enter a first name", ""); 
 
     } 
 

 
     this.lastName = prompt("Please enter a last name", ""); 
 
     while (this.lastName == null || this.lastName == "") { 
 
     this.lastName = prompt("Invalid input. Please enter a last name", ""); 
 
     } 
 

 
     this.age = prompt("Please enter an age", ""); 
 
     this.age = parseInt(this.age); 
 
     while (this.age == null || isNaN(this.age) || this.age < 0) { 
 
     this.age = prompt("Not a valid input. Please enter an age", ""); 
 
     this.age = parseInt(this.age); 
 
     } 
 
    } 
 
    } 
 
    
 
    var personDetail = new person(); 
 
    
 
    document.writeln("<table>"); 
 
\t document.writeln(" <tr>"); 
 
\t document.writeln(" <th>First Name</th>"); 
 
\t document.writeln(" <th>Last Name</th>"); 
 
\t document.writeln(" <th>Age</th>"); 
 
\t document.writeln(" </tr>"); 
 
\t 
 
\t for (var z = 0; z < 5; z++) { 
 
\t \t document.writeln(" <tr>"); 
 
\t \t document.writeln(" <td>" + personDetail.firstName + "</td>"); 
 
\t \t document.writeln(" <td>" + personDetail.lastName + "</td>"); 
 
\t \t document.writeln(" <td>" + personDetail.age + "</td>"); 
 
\t \t document.writeln(" </tr>"); 
 
\t } \t 
 
\t 
 
\t document.writeln("</table>"); 
 
    
 
</script>

我知道我有收集用户输入到一个数组,但我不知道怎么办。

我试过以下。只是把名字为例:

<script> 
 
    function person(firstName[]) { 
 

 
     for (var x = 1; x <= 3; x++) { 
 
     this.firstName[x - 1] = prompt("Please enter a first name", ""); 
 
     while (this.firstName[x - 1] == null || this.firstName[x - 1] == "") { 
 
      this.firstName[x - 1] = prompt("Invalid input. Please enter a first name", ""); 
 
     } 
 
     } 
 
    } 
 

 
    var personDetail = new person(); 
 

 
    for (var z = 0; z < 3; z++) { 
 
     document.writeln(personDetail.firstName[z]); 
 
    } 
 
    </script>

我知道有更容易的方法可以做到这一点,但我需要使用一个对象具有构造函数。

+0

改变人(名字[])到人创建一个对象(名字) –

+0

我试过了。然而,输出仅返回用户的最终输入。我试图用firstName创建一个数组,以便每个输入都作为一个元素输入到该数组中,然后我可以在末尾显示它 – Abd

+0

如果我理解你是正确的,请尝试下面的代码https://jsfiddle.net/0v7k1g7n/ – Kirill

回答

1

使用数组来存储人

jsfiddle.net/0v7k1g7n/

var people = [ new person(), new person(), new person() ]; 

var table = document.getElementById("people"); 
for(var i = 0; i < people.length; i++){ 
    table.innerHTML += "<tr><td>" + people[i].firstName + "</td><td>" + people[i].lastName + "</td><td>" + people[i].age + "</td></tr>" 
} 

或所有

jsfiddle.net/0v7k1g7n/1

var People = function(){ 
    var data = []; 
    var table = document.getElementById("people"); 

    this.addPerson = function(p){ 
    data.push(p); 
    return this; 
    } 

    this.render = function(){ 
    for(var i = 0; i < data.length; i++){ 
     table.innerHTML += "<tr><td>" + data[i].firstName + "</td><td>" + data[i].lastName + "</td><td>" + data[i].age + "</td></tr>" 
    } 
    } 
} 

var p = new People(); 

p.addPerson(new person()).addPerson(new person()).addPerson(new person()).render();