Question

我有一个页面，允许用户编辑他们的数据（在数据库上）。我有一个插入行的JavaScript。这些行包含文本框，其值存储在不同的变量中。所以，我需要一种方法来插入一个具有相同结构但不同变量名的表行。

为了同时插入/编辑数据，我需要在不同的字段上使用不同的值。（插入/编辑在edited.php页面上进行）

JavaScript的：

<script type="text/javascript">
    function addRow(tableID) {

        var table = document.getElementById(tableID);

        var rowCount = table.rows.length;
        var row = table.insertRow(rowCount);

        var colCount = table.rows[0].cells.length;

        for(var i=0; i<colCount; i++) {

            var newcell = row.insertCell(i);

            newcell.innerHTML = table.rows[1].cells[i].innerHTML;
            //alert(newcell.childNodes);
            switch(newcell.childNodes[0].type) {
                case "text":
                        newcell.childNodes[0].value = "";
                        break;
                case "checkbox":
                        newcell.childNodes[0].checked = false;
                        break;
                case "select-one":
                        newcell.childNodes[0].selectedIndex = 0;
                        break;
            }
        }
    }

</script>

此脚本在我的html表上插入一个表行。通过复制第一个表行来进行插入。我需要一个包含NEW变量的新行。

是否有定义插入的行？

Answer 1

你可以使用javascript createElement函数，这里有一个小例子可以让你上路：

    function addNewRow(tableID) {

        var table = document.getElementById(tableID);

        var row = document.createElement('tr');
        var data = document.createElement('td');
        var tbx = document.createElement('input');
        tbx.setAttribute('type', 'text');

        data.appendChild(tbx);

        row.appendChild(data);
        table.appendChild(row);

    }

它应该是相当不言自明的，创建一个元素，设置它的属性，并添加子元素，在你的情况下：文本框，复选框等。

如果您需要动态ID和/或值，请添加计数器变量并随着时间的推移增加和/或添加

等参数

function addNewRow(tableID, input1, input2, input3){}

Answer 2

您可以为您动态创建的每一行指定名称，如下所示：

var row_counter=0 // have a global counter
var row = table.insertRow(rowCount);
row.setAttribute("id", "row"+row_counter);
//NOW INCREMENT THE COUNTER BASED ON YOUR LOOP

您可以按照自己想要的方式计算循环。

使用具有不同变量名称的JavaScript插入HTML表行

2 个答案: