jQuery: Wie komme ich zu einem bestimmten Kind eines Elternteils?

Um ein vereinfachtes Beispiel zu geben, habe ich den folgenden Block wiederholt bekam auf der Seite viele Male (es dynamisch generiert wird):jQuery: Wie komme ich zu einem bestimmten Kind eines Elternteils?

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

Wenn Sie darauf klicken, kann ich mit dem Mutter der Verbindung erhalten:

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

Allerdings ... Ich muss an die <div class="something1"> dieses bestimmten Elternteils gelangen.

Kann mir jemand im Grunde sagen, wie man sich auf ein höheres Geschwister bezieht, ohne direkt darauf verweisen zu können? Nennen wir es großen Bruder. Ein direkter Verweis auf den Klassennamen des großen Bruders würde dazu führen, dass jede Instanz dieses Elements auf der Seite ausgeblendet wird - was nicht der gewünschte Effekt ist.

Ich habe versucht:

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

jedermann? Vielen Dank.

Quelle

2010-03-08 Tom

Anurags Antwort scheint nicht die richtige zu sein - das hat mich sicherlich dazu gebracht, innezuhalten und nachzudenken - aber es zeigt einen eklatanten Tippfehler in Ihrem Code, der Ihren Selektor zum Scheitern bringt. Der Selektor in jQuery ist '.parent()' * not * '.parents()' –

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

@ricebowl ... parent() würde mir div something2 geben, also brauche ich eltern(), um div box zu bekommen. – Tom

120

Der Aufruf .parents(".box .something1") gibt alle übergeordneten Elemente zurück, die mit dem Selektor .box .something übereinstimmen. Mit anderen Worten, es gibt übergeordnete Elemente zurück, die .something1 sind und in .box sind.

Sie müssen die Kinder der engsten Eltern bekommen, wie folgt aus:

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

Dieser Code .closest ruft die innerste Eltern bekommen einen Wähler übereinstimmt, dann ruft .children an diesem übergeordneten Element der Onkel, Sie finden Ich suche nach.

Quelle

2010-03-08 02:27:24 SLaks

Ausgezeichnetes Dankeschön, funktioniert genau wie gewünscht. – Tom

Ich weiß, das ist ein bisschen alt, aber ist es nicht besser in diesem Fall ** parent() ** statt ** nearest() ** zu verwenden, da ich mir vorstellen kann, dass es mehr Baum Traversal mit ** nächsten() * gibt *? – acSlater

@acSlater: Er _needs_ Baum Traversal. 'parent()' ist das falsche Element. – SLaks

$(this).parent()

Baum-Traversal ist Spaß

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

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

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

Und viel mehr Möglichkeiten, können Sie diese docs hilfreich.

Quelle

2010-03-08 02:27:11 Anurag

Danke, aber war nicht auf der Suche nach dem Elternteil, sondern eher ein anderes Kind des Elternteils (oder Großeltern tatsächlich). – Tom

Hehe ... es ist in der Tat eine Familienangelegenheit. – Tom

Wenn ich Ihr Problem richtig verstanden habe, $(this).parents('.box').children('.something1') Ist das, was Sie suchen?

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

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

Quelle

2010-03-08 02:33:50

Das funktioniert auch. – Tom

Sie .each() mit .children() und einen Selektor in der Klammer verwenden könnte.

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

Quelle

2013-03-25 22:10:10 Olly

Diese finden die ersten Eltern mit Klasse box dann das erste Kind Klasse mit regex finden something passende und die ID erhalten:

Quelle

2013-08-06 03:04:29 user2601995

jQuery: Wie komme ich zu einem bestimmten Kind eines Elternteils?

Antwort

Verwandte Themen