行刪除後刪除表

我試圖刪除所有行後刪除表，但不知何故，我不能檢查表是否刪除所有行後有子級。
我不明白爲什麼尋找子元素長度不工作在這裏？有什麼建議麼？行刪除後刪除表

<!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(); 
}

來源

2015-02-10 Akin Dönmez

注意，表由THEAD和TBODY標籤的 – 2015-02-10 16:48:19

我們能看出你的JavaScript，請。 - 對不起，我現在看到它 – 2015-02-10 16:49:04

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

這將幫助你

來源

2015-02-10 16:55:03 Rajashekhar

可以代替試試這個：

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

瀏覽器通常會增加<tbody>和<thead>標籤進入，即使他們不是在你的HTML表格，這樣行並不是唯一的孩子。上面的代碼只是查找行。

來源

2015-02-10 16:48:48 jd182

你應該能夠檢查'length'是否是falsy（'if（！$（sel）.length）'），而不是確保它小於1。 – ssube 2015-02-10 16:51:18

行刪除後刪除表

回答

相關問題