jQuery: come arrivare a un particolare figlio di un genitore?

Per dare un esempio semplificato, ho il seguente blocco ripetuto nella pagina web un sacco di volte (è generato dinamicamente):jQuery: come arrivare a un particolare figlio di un genitore?

<div class="box"> 
    <div class="something1"></div> 
    <div class="something2"> 
     <a class="mylink">My link</a> 
    </div> 
</div>

Quando si fa clic, posso ottenere al genitore del legame con:

$(".mylink").click(function() { 
    $(this).parents(".box").fadeOut("fast"); 
});

Tuttavia ... Ho bisogno di arrivare allo <div class="something1"> di quel particolare genitore.

Fondamentalmente, qualcuno può dirmi come fare riferimento a un fratello di livello superiore senza poterlo fare direttamente? Chiamiamolo fratello maggiore. Un riferimento diretto al nome della classe del fratello maggiore causerebbe la dissolvenza di ogni istanza di quell'elemento nella pagina, che non è l'effetto desiderato.

ho provato:

parents(".box .something1") ... no luck. 
parents(".box > .something1") ... no luck. 
siblings() ... no luck.

Chiunque? Grazie.

fonte

2010-03-08 Tom

La risposta di Anurag potrebbe non sembrare quella giusta - certamente mi ha fatto smettere e pensare - ma sta evidenziando uno sfacciato errore nel codice che sta causando il fallimento del selettore. Il selettore, in jQuery, è '.parent()' * not * '.parents()' –

@ricebowl: Wrong. http://api.jquery.com/parents/ – SLaks

@ricebowl ... parent() mi avrebbe dato div qualcosa2, quindi ho bisogno dei genitori() per arrivare a div box. – Tom

120

La chiamata .parents(".box .something1") restituisce tutti gli elementi padre che corrispondono al selettore .box .something. In altre parole, restituirà gli elementi parent .something1 e all'interno di .box.

è necessario per ottenere i bambini del genitore più vicino, in questo modo:

$(this).closest('.box').children('.something1')

Questo codice chiama .closest per ottenere il genitore più interno corrispondenza di un selettore, quindi chiama .children su quel elemento padre per trovare lo zio si stai cercando.

fonte

2010-03-08 02:27:24 SLaks

Eccellente grazie, funziona esattamente come voluto. – Tom

So che questo è un po 'vecchio ma non è meglio in questo caso usare ** parent() ** piuttosto che ** closest() ** come immagino ci sia più traversal tra alberi con ** closest() * *? – acSlater

@acSlater: He _needs_ tree traversal. 'parent()' è l'elemento sbagliato. – SLaks

$(this).parent()

Albero attraversamento è divertente

$(this).parent().siblings(".something1"); 

$(this).parent().prev(); // if you always want the parent's previous sibling 

$(this).parents(".box").children(".something1");

E molto di più modi, si potrebbe trovare questi docs utile.

fonte

2010-03-08 02:27:11 Anurag

Grazie ma non cercavo il genitore, ma piuttosto un altro figlio di genitore (o nonno in realtà). – Tom

Hehe ... è un affare di famiglia davvero. – Tom

Se ho compreso correttamente il problema, $(this).parents('.box').children('.something1') È questo quello che stai cercando?

fonte

2010-03-08 02:33:50

Funziona anche. – Tom

Si potrebbe usare .each() con .children() e un selettore all'interno della parentesi:

//Grab Each Instance of Box. 
$(".box").each(function(i){ 

    //For Each Instance, grab a child called .something1. Fade It Out. 
    $(this).children(".something1").fadeOut(); 
});

fonte

2013-03-25 22:10:10 Olly

Questa troveranno il primo genitore con classe box quindi trovare la prima classe bambino con espressione regolare corrispondenza something e ottenere l'id.

$(".mylink").closest(".box").find('[class*="something"]').first().attr("id")

fonte

2013-08-06 03:04:29 user2601995

jQuery: come arrivare a un particolare figlio di un genitore?

risposta

Problemi correlati