简体   繁体   English

使用JavaScript删除HTML表格中的行数

[英]Remove no of rows in html table using javascript

Add no of rows dynamically everytime deleting the existing reocds is not working only single new row is getting created.Here I tried to create new 3 rows.Please hlep me. 每次删除现有记录时都无法动态添加任何行,仅创建一个新行就行了。在这里,我尝试创建新的3行。请帮我。

<TABLE id="dataTable" width="350px" border="1">      
</TABLE>

function addRow(tableID) 
        {     
            var table = document.getElementById(tableID);                
            deleteRow(tableID);
            for(i=0;i<3;i++)
            {
              var rowCount = table.rows.length;
              var row = table.insertRow(rowCount);
              var cell0 = row.insertCell(i);
              var element0 = document.createElement("input");
              element0.type = "text";
              element0.name = "txtbox[]";
              cell0.appendChild(element0);

              var cell1 = row.insertCell(i+1);
              var element1 = document.createElement("input");
              element1.type = "text";
              element1.name = "txtbox[]";
              element1.value = tableID+"_"+rowCount+"_newschedule";
              cell1.appendChild(element1);
           }    
        }

        function deleteRow(tableID) {
            try 
             {
                var table = document.getElementById(tableID);
                var rowCount = table.rows.length;                
                for(i =(rowCount-1);i>=0;i--)
                 {
                   table.deleteRow(i);
                 }

              }
           catch(e)
             {                    
             }
        }

Try this 尝试这个

function addRow(tableID) {
            var table = document.getElementById(tableID);
            deleteRow(tableID);
            for (i = 0; i < 3; i++) {
                var rowCount = table.rows.length;
                var row = table.insertRow(rowCount);

                var cell0 = row.insertCell(0);
                var element0 = document.createElement("input");
                element0.type = "text";
                element0.name = "txtbox[]";
                cell0.appendChild(element0);

                var cell1 = row.insertCell(1);
                var element1 = document.createElement("input");
                element1.type = "text";
                element1.name = "txtbox[]";
                element1.value = tableID + "_" + rowCount + "_newschedule";

                cell1.appendChild(element1);
            }
        }

These two lines were wrong 这两行是错误的

var cell0 = row.insertCell(i);
var cell1 = row.insertCell(i+1);

Because insertCell(i) takes the index of the cell(TD) to be added in the row(TR) but after first iteration your i becomes 1 and then you try to insert the cell at index 1 before inserting a cell at 0 and then you get's an index error. 因为insertCell(i)接受要在row(TR)中添加的单元格(TD)的索引,但是在第一次迭代之后,您的i变为1,然后您尝试在索引1处插入该单元格,然后在0处插入一个单元格,然后您得到索引错误。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM