簡體   English   中英

在刪除行后刪除表

[英]deleting the table after rows are deleted

我試圖在刪除所有行后刪除表,但是以某種方式我無法在刪除所有行后檢查表是否有子級。
我不明白為什么在這里尋找子元素的長度不起作用? 有什么建議么 ?

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>table manipulation </title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" type="text/css" href="stylesheet.css" />
        <script src="..//jquery-2.1.3.min.js"></script>
        <script src="table.js" type="text/javascript"></script>
    </head>
    <body>
        <table id = "table1">
  <tr id = "1">
    <td id = "information1"> i m the first row !</td>
    <td><button id = "button1" class = "buttonclass" onClick="reply_click(this.id)"> destroy ! </button></td> 
  </tr>
  <tr id = "2">
   <td id = "information2"> i m the second row !</td>
    <td><button id = "button2" class = "buttonclass" onClick="reply_click(this.id)"> destroy ! </button></td> 
  </tr>
   <tr id = "3">
   <td id = "information3" > i m the third row !</td>
    <td><button id = "button3" class = "buttonclass" onClick="reply_click(this.id)"> destroy ! </button></td> 
  <tr id = "4">
   <td id = "information4" > i m the fourth row !</td>
    <td><button id = "button4" class = "buttonclass" onClick="reply_click(this.id)"> destroy ! </button></td> 
  </tr> 
       </table>
        <div id = "newtable"> </div>
    </body>
</html>


var id ; 
var table = $('<table></table>').addClass('foo');

function destroy(){
    var theParent = document.querySelector("#table1");
   var parent = $("#" + id).parent();
  $("#" + id).fadeOut( "slow", function() {
      $(parent).closest('tr').remove();
      alert(theParent.innerHTML);

  });


    var row = $('<tr</tr>').addClass('bar').text(parent.siblings().html());
    table.append(row);
   $("#newtable").append(table);
  parent.siblings().remove();



theParent.addEventListener("click", doSomething, false);


}
function doSomething(e) {

  if($("#table1").children().length < 1 ){
     theParent.remove();
  }


}

function reply_click(clicked_id)
{
    id = clicked_id;
    destroy();
}
function doSomething(e) {
  if($("#table1 tr").length <= 1 ){
     theParent.remove();
  }
}

這對你有幫助

您可以嘗試以下方法:

if($("#table1").find('tr').length < 1 ){
   theParent.remove();
}

瀏覽器通常會將<tbody><thead>標記添加到表中,即使它們不在HTML中也是如此,因此行不是唯一的子代。 上面的代碼僅查找行。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM