Come selezionare il primo antenato che corrisponde a un selettore?

Question

Generale:

Come posso selezionare il primo antenato corrispondenza di un elemento in jQuery?

Esempio:

prendere questo blocco HTML

<table> 
    <tbody> 
     <tr> 
      <td> 
       <a href="#" class="remove">Remove</a> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <a href="#" class="remove">Remove</a> 
      </td> 
     </tr> 
    </tbody> 
</table> 

posso rimuovere una riga della tabella facendo clic su "Elimina" utilizzando questo codice jQuery:

$('.remove').click(function(){ 
    $(this).parent().parent().hide(); 
    return false; 
}); 

questo funziona , ma è piuttosto fragile. Se qualcuno inserisce lo <a> in un <div>, ad esempio, si romperà. C'è una sintassi di selezione in jQuery che segue questa logica:

"Ecco un elemento, ora trovare l'antenato più vicino che corrisponde alcuni criteri di selezione e restituirlo"

Grazie

Answer 1

Quello sarebbe closest:

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

Answer 2

È possibile passare un selettore all'argomento padre, credo.

$('.remove').click(function(){ 
    $(this).parents("tr:first").hide(); 
    return false; 
}); 

Oppure è possibile utilizzare il più vicino come indicato da un'altra risposta.

$('.remove').click(function(){ 
    $(this).closest("tr").hide(); 
    return false; 
}); 

Answer 3

Io preferisco usare closest come sottolinea @Kobi out (+1) come sembra essere il modo più conciso per farlo. Giusto per sottolineare, è anche possibile utilizzare parents:

$(this).parents("tr:first") 

Answer 4

Supponendo che si sta utilizzando jQuery 1.4, è possibile utilizzare .parentsUntil() che restituirà tutti gli antenati fino ma NON tra cui l'antenato selezionato.

Quindi nel tuo caso vorrei andare con qualcosa di simile:

$('.remove').click(function(){ 
    $(this).parentsUntil("tr").parent().hide(); 
    return false; 
});