未捕获的TypeError:对象[对象对象]没有方法' tableRow'

时间:2013-05-03 12:05:09

标签: javascript html html-table

我正在创建一个通讯录,并希望在用户输入数据时更新表格,但我一直收到有关'tableRow'的错误。我已经尝试将其更改为不同的功能名称等,但似乎无法找到解决方案。

var nameField, addressField, emailField, postcodeField;

function twoDigit(v){
if(v.toString().length < 2){
    return "0"+v.toString();
} else {
    return v.toString();
}
}

var Contact = function(name, address, email, postcode){
this.name = name;
this.address = address;
this.email = email;
this.postcode = postcode;
this.completed = false;
};

var contacts = [];

Contact.prototype.toString = function(){
var s = this.name + '\n' + this.address + '\n' + this.email + + '/n'
  +  this.postcode.toString() + '\n';
if(this.completed){
    s += "Completed\n\n";
} else {
    s += "Not Completed\n\n";
}
return s;
};

Contact.prototype.tableRow = function(){
var tr = "<tr><td>" + this.name + "</td><td>" +
         this.address + "</td><td>" + this.email +
         "</td><td>" + this.address + ">";
};


var addContact = function(nameField, addressField, emailField, postcodeField){
a = new Contact(nameField.value, addressField.value, emailField.value,                                                  
postcodeField.value;   
contacts.push(a);
};

var clearUI = function(){
var white = "#fff";
nameField.value = "";
nameField.style.backgroundColor = white;
addressField.value = "";
addressField.style.backgroundColor = white;
emailField.value = "";
emailField.style.backgroundColor = white;
postcodeField.value = "";
postcodeField.style.backgroundColor = white;

};

var updateList = function(){
var tableDiv = document.getElementById("table"),
table = "<table border='1'><thead><th>Name</th><th>Address</th>
<th>Email</th><th>Postcode</th><th>Completed</th></thead>";
  for(var i=0, j=contacts.length; i<j; i++){
    var contacts1 = contacts[i];
     table += contacts1.tableRow();
}
table+="</table>";
tableDiv.innerHTML = table;
};

var add = function(){
addContact(nameField, addressField, emailField, postcodeField);
clearUI();
updateList();
};

var cancel = function(){
clearUI();
updateList();
};

window.onload = function(){
nameField = document.getElementById("name");
addressField = document.getElementById("address");
emailField = document.getElementById("email");
postcodeField = document.getElementById("postcode");
okButton = document.getElementById("ok");
okButton.onclick = add;
cancelButton = document.getElementById("cancel");
cancelButton.onclick = cancel;
clearUI();
};

var showTable = function(){
var tableDiv = document.getElementById("table"),
    table = "<table border='1'><thead><th>Name</th><th>Address</th>
<th>Email</th><th>Postcode</th></thead>";

for(var i=0, j=contacts.length; i<j; i++){
    var contacts1 = contacts[i];
    table += contacts1.tableRow();
}
table+="</table>";
tableDiv.innerHTML = table;
};

1 个答案:

答案 0 :(得分:1)

将tableRow函数添加到联系人

Contact.prototype.tableRow = function() {
    return '<tr>' + '<td>' + this.name + '</td>' + '<td>' + this.address + '</td>' + '<td>' + this.email + '</td>' + '<td>' + this.postcode + '</td>' + '</tr>';
}