我通过html页面上的输入表在Javascript中创建了一个表。我在Javascript表上添加了一个删除和编辑按钮,所以当它返回值时,这两个按钮会出现在每行添加的末尾。但是,我根本无法获得任何类型的编辑按钮。我到处寻找。谁能帮我? 我有一个整个程序的jsFiddle。
http://jsfiddle.net/aabbey0411/c46d9n2e/
这是我创建按钮的地方:
/**
* This function returns a row of an HTML table containing the contact data.
*/
Contact.prototype.tableRow = function() {
var deleteButton = "<button id ='delete' onclick= 'deleteRow(this)'>Delete</button>"
var editButton = "<button id ='edit' onclick='editRow(this)'>Edit</button>"
var tr = "</td><td>" + this.forename + "</td><td>" + this.surname + "</td><td>" + this.category + "</td><td>" + this.dob + "</td>" +
"<td>" + this.marital_status + "</td><td>" + this.phone + "</td><td>" + this.email + "</td><td>" + this.address + "</td>" +
"<td>" + this.postcode + "</td><td>" + this.notes + "</td>" +
"<td>" + editButton + "</td>" + "<td> " + deleteButton + "</td></tr>";
return tr;
};
/* This function builds the HTML table, using the input of contact details
*/
var updateList = function () {
var tableDiv = document.getElementById("table"),
table = "<table border='1'><thead><th>Forename</th><th>Surname</th><th>Category</th><th>Date of Birth</th>" +
"<th>Status</th><th>Phone Number</th><th>Email Address</th><th>Address</th><th>Postcode</th><th>Notes</th></thead>";
for (var i = 0, j = contacts.length; i < j; i++) {
var cont = contacts[i];
table+= cont.tableRow();
}
table+= "</table>";
tableDiv.innerHTML = table;
};
var showTable = function () {
var tableDiv = document.getElementById("table"),
table = "<table border='1'><thead><th>Forename</th><th>Surname</th><th>Category</th><th>Date of Birth</th><th>Status</th><th>Phone Number</th>" +
"<th>Email Address</th><th>Address</th><th>Postcode</th><th>Notes</th><th>Delete</th></thead>";
for(var i=0, j=contacts.length; i<j; i++){
var cont = contacts[i];
table += cont.tableRow();
}
table+="</table>";
tableDiv.innerTML = table;
};