Domanda

Ho una tabella HTML con una TH riga e diversi TR che vengono aggiunti dinamicamente. Ogni TR ha un pulsante nell'ultima colonna.

Di cosa ho bisogno in modo che facendo clic sul pulsante il TR più vicino viene rimosso dalla tabella? Ho provato a usare $(this).closest.remove() Ma questo non ha funzionato, quindi presumo di dover aggiungere ID o qualcos'altro qui.

Una tabella di esempio di base sembrerebbe la seguente:

<table class='tableClass'>
    <tbody>
        <th>
            <td>Text</td><td>Text</td><td>Text</td>
        </th>
        <tr>
            <td>Text</td><td>Text</td><td><button type='button' class='btnClass'>Delete</button></td>
        </tr>
        <tr>
            <td>Text</td><td>Text</td><td><button type='button' class='btnClass'>Delete</button></td>
        </tr>
        <tr>
            <td>Text</td><td>Text</td><td><button type='button' class='btnClass'>Delete</button></td>
        </tr>
    </tbody>
</table>
È stato utile?

Soluzione

Devi dare il closest Funzionare un selettore. Prova questo:

$('.btnClass').click(function() {
    $(this).closest('tr').remove();
});

Inoltre, il tuo HTML non è valido come th dovrebbe essere figlio di tr:

<table class='tableClass'>
    <tbody>
        <tr>
            <th>Text</th>
            <th>Text</th>
            <th>Text</th>
        </tr>
        <tr>
            <td>Text</td>
            <td>Text</td>
            <td>
                <button type='button' class='btnClass'>Delete</button>
            </td>
        </tr>
        <tr>
            <td>Text</td>
            <td>Text</td>
            <td>
                <button type='button' class='btnClass'>Delete</button>
            </td>
        </tr>
        <tr>
            <td>Text</td>
            <td>Text</td>
            <td>
                <button type='button' class='btnClass'>Delete</button>
            </td>
        </tr>
    </tbody>
</table>

FILDLE ESEMPIO

Altri suggerimenti

Puoi farlo usando .closest( selector ) propriamente come:

$(this).closest('tr').remove();

In realtà nel tuo codice:

$(this).closest.remove()
            ___^___

Ti mancano sia la parentesi di apertura che chiusura () e il selettore tr.

http://jsfiddle.net/cpvh9/

$(".btnClass").click(function(){
        $(this).parents('tr').remove();
    });

Dal tuo codice HTML sembra che tu voglia rimuovere il genitore TR, prova questo

$(".btnClass").click(function(){
    $(this).parents("tr:first").remove();
});
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top