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 - 刪除表格行不起作用？

回答

相關問題