我正在尝试设计HTML表格,当我单击“添加行”按钮&时可以添加一行如果我打算删除添加的行,则相同.我写了一个JavaScript来添加复选框和文本.但是我什至想要组合框,而且我陷在中间.你们能弄清楚并让我知道该怎么做吗?
这是我的JS文件.
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkBox";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
cell2.innerHTML = rowCount + 1;
var cell3 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell3.appendChild(element2);
var cell4 = row.insertCell(3);
var element3 = document.createElement("input");
element3.type = "text";
cell4.appendChild(element3);
var cell5 = row.insertCell(4);
//This is where the PROBLEM is!!
var element4 = document.createElement("select");
element4.type = "option";
cell5.appendChild(element4);
}
function deleteRow(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkBox = row.cells[0].childNodes[0];
if(null != chkBox && true == chkBox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
// JavaScript文档
注意:请不要建议SERVER_SIDE SCRIPTING.我只是在做Java脚本作业:)
最佳答案
这应该可以解决问题:
var cell5 = row.insertCell(4);
//This is where the SOLUTION is!!
var element4 = document.createElement("select");
var option1 = document.createElement("option");
option1.value="1";
option1.innerHTML="sample1";
element4.appendChild(option1);
var option2 = document.createElement("option");
option2.value="2";
option2.innerHTML="sample2";
element4.appendChild(option2);
cell5.appendChild(element4);