/ / Usuń wiersz tabeli za pomocą jQuery - jquery

Usuń wiersz tabeli za pomocą jQuery - jquery

Oto mój kod

Scenariusz

$(document).ready(function(){
$("#click").click(function(){
$("#table").append("<tr><td>&nbsp;</td></tr>");
})
$("#remove").click(function(){
$("#table").remove("<tr><td>&nbsp;</td></tr>");
})
})

HTML

<table width="100%" border="1" cellspacing="0" cellpadding="0" id="table">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
<div id="click">click</div>
<div id="remove">remove</div>

Po dodaniu wiersza działa świetnie, ale nie wiem, jak usunąć ostatni wiersz tabeli. Możesz również sprawdzić online próbny.

Jak mogę to zrobić?

Ponadto chcę, gdy użytkownik również klikniekażdy wiersz sam się usunie. Próbowałem, ale jest problem. Jeśli klikniesz wiersz, usuwa się on sam, ale po dodaniu wiersza przez kliknięcie przycisku #kliknij wiersz nie usuwa się, klikając go.

Oto mój kod:

Scenariusz

$(document).ready(function(){
$("#click").click(function(){
$("#table").append("<tr><td>&nbsp;</td></tr>");
})
$("#remove").click(function(){
$("#table tr:last").remove();
})
$("#table tr").click(function(){
$(this).remove();
});
})

Odpowiedzi:

22 dla odpowiedzi nr 1

Jeśli chcesz usunąć ostatni wiersz tabeli #table, musisz ustawić go za pomocą selektora, a następnie zadzwonić $.remove() przeciwko temu:

$("#remove").on("click", function(){
$("#table tr:last").remove();
})

5 dla odpowiedzi nr 2

Nie możesz usunąć w ten sposób, musisz określić, który węzeł chcesz usunąć $("#table tr:first") i usuń to remove()

$("#remove").click(function(){
$("#table tr:first").remove();
})

http://jsfiddle.net/2mZnR/1/


1 dla odpowiedzi nr 3

Demo jest na http://jsfiddle.net/BfKSa/ lub jeśli jesteś wiążący, dodaj i usuń do każdego wiersza, to inne demo http://jsfiddle.net/xuM4N/ się przydać.

API: remove => http://api.jquery.com/remove/

Jak wspomniałeś: Spowoduje to usunięcie „skasuj ostatni wiersz tabeli”

$("#table tr:last").remove(); załatwi sprawę w twojej sprawie.

Kod

$(document).ready(function(){
$("#click").click(function(){
$("#table").append("<tr><td>foo add&nbsp;</td></tr>");
})
$("#remove").click(function(){
$("#table tr:last").remove();
})
})

0 dla odpowiedzi nr 4

Znajdź ostatni wiersz za pomocą selektora i usuń ten wiersz w ten sposób:

$("#table > tr:last").remove();

Spowoduje to usunięcie ostatniego wiersza w tabeli. Co jeśli chcesz usunąć pierwszy?

$("#table > tr:first").remove();

To wszystko. Istnieje kurs online dla jQuery. Oto link: http://jqueryair.com/


0 dla odpowiedzi № 5

Możesz usunąć ostatni tr z tabeli za pomocą klasy tabeli po kliknięciu przycisku.

$("#remove").on("click", function(){
$(".tbl tr:last").remove();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="tbl" width="100%" border="1" cellspacing="0" cellpadding="0" >
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
<button id="remove">remove</button>


0 dla odpowiedzi № 6

Jeśli chcesz usunąć sam wiersz, kliknij następnie wiersz tabeli

$("table tr").on("click", function(){
$(this).remove();
});

Jeśli chcesz dodać wiersz po kliknięciu przycisku kliknij na końcu tabeli

 $("#click").click(function(){
$("#table").append("<tr><td>Xyz</td></tr>");
})