jQuery: ce qui est nécessaire pour supprimer le plus près avec le bouton Cliquez sur

Question

J'ai une table HTML avec une ligne TH et plusieurs TR qui sont ajoutés dynamiquement. Chaque tr a un bouton dans la dernière colonne.

De quoi ai-je besoin pour qu'en cliquez sur le bouton, le TR le plus proche est supprimé de la table? J'ai essayé d'utiliser $(this).closest.remove() Mais cela n'a pas fonctionné, donc je suppose que je dois ajouter des identifiants ou autre chose ici.

Un exemple de base de base ressemblerait à ce qui suit:

<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>

Answer 1

Vous devez donner le closest Fonctionne un sélecteur. Essaye ça:

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

De plus, votre HTML n'est pas valide comme th devrait être un enfant de 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>

Exemple de violon

Answer 2

Vous pouvez le faire en utilisant .closest( selector ) comme bien comme:

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

En fait dans votre code:

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

Vous manquez à la fois les parenthèses d'ouverture et de fermeture () Et le sélecteur tr.

Answer 3

http://jsfiddle.net/cpvh9/

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

Answer 4

De votre code HTML, il semble que vous vouliez supprimer le parent tr, essayez ceci

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