javascript-动态添加组合框

前端之家收集整理的这篇文章主要介绍了javascript-动态添加组合框 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在尝试设计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);

猜你在找的HTML相关文章