JS - 删除表格行不起作用？

我目前有一个添加和删除行。我已将其设置为具有div的设计元素，但是，当我尝试删除一行并不删除时，我想知道您是否可以提供帮助。JS - 删除表格行不起作用？

查看这里的HTML代码呢！

<script language="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[0].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; 
      } 
     } 
    } 

    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[5].childNodes[0]; 
       if (null != chkbox && true == chkbox.checked) { 
        if(rowCount <= 1) { 
         alert("Cannot delete all the rows."); 
         break; 
        } 
        table.deleteRow(i); 
        rowCount--; 
        i--; 
       } 
      } 
     }catch(e) { 
      alert(e); 
     } 
    } 
</script>

来源

2014-02-24 user3348182

你需要改变这一行：

var chkbox = row.cells[5].childNodes[0];

到：

var chkbox = row.querySelector('input[type=checkbox]');

来源

2014-02-24 19:40:32

谢谢！我爱你！ – user3348182

你的问题是指chkbox元素，在deleteRow，这里：

var chkbox = row.cells[5].childNodes[0];

当您遇到问题时，请尝试使用console.log在潜在危险线路上跟踪您的代码。在此示例中，console.log(chkbox)返回包装div，而不是预期的复选框。通过使用queryselector

var chkbox = row.querySelector('input[type=checkbox]');

看到工作小提琴http://jsfiddle.net/SpacePineapple/D77Dz/2/

PS我看到你在试图实现

var chkbox = row.cells[5].childNodes[0].childNodes[0];

或全忘了长树的遍历：所以改变占位符（默认值）。你可能想看看HTML5规范的占位符

来源

2014-02-24 19:41:01 TastySpaceApple

此：

var chkbox = row.cells[5].childNodes[0];

应该是这样的：

var chkbox = row.cells[5].children[0].children[0];

你了吧，你指的是TextNode的方式。

当您将其更改为.children[0]时，会得到包装输入的DIV元素，因此您需要获取该DIV的第一个子元素。

来源

2014-02-24 19:43:35

JS - 删除表格行不起作用？

回答

相关问题