2012-03-25 17 views
0

Ich habe einige HTML-Code, der wie folgt aussieht:Wie Ziel Elternteil eines Hyperlinks in JQuery

<div class="product"> 
Content In Here 
    <div class="price"> 
    <a href="#" class="removeLink">Remove</a> 
    </div> 
</div> 

Ich versuche gezielt die Eltern des Entfernen Link wie folgt:

$('.removeLink').click(function(event) { 
     event.preventDefault(); 
    $(this).parent('.product').fadeOut('fast'); 
}); 

Aber aus irgendeinem Grund funktioniert es nicht und ich kann nicht herausfinden, warum, es gibt keine Fehlermeldungen in der Javascript-Konsole, keine Ahnung, warum es die Eltern .product div nicht ausblendet.

+0

einige jsfiddle wäre nett ... – KoolKabin

Antwort

4

Ich glaube, Sie parents() wollen, nicht der Singular:

$('.removeLink').click(function(event) { 
     event.preventDefault(); 
    $(this).parents('.product').fadeOut('fast'); 
}); 
+0

Yeah sieht aus wie Eltern nur geht ein div/Element – Talon

2

Sie wollen $(this).closest('.product'), die für das nächste Element nachschlägt der DOM-Baum, der .product übereinstimmt. Die Methode .parent funktioniert, indem Sie das übergeordnete Element des Elements auswählen (in diesem Fall <div class="price">) und dann den angegebenen Filter anwenden. Das heißt, was Sie sagen, ist: "Wählen Sie das übergeordnete Element, wenn das übergeordnete Element .product entspricht", was eindeutig nicht Ihren Vorstellungen entspricht.

2

Verwenden Sie die closest() Methode

$('.removeLink').click(function(event) { 
     event.preventDefault(); 
    $(this).closest('.product').fadeOut('fast'); 
});​ 

Arbeits Demo: http://jsfiddle.net/Pyxnm/1/

0

versuchen, diese

$(document).ready(function(){ 

    $('.removeLink').click(function(event) { 
    event.preventDefault(); 
    $(this).parent().parent().fadeOut(); 
    }); 

}); 

so hier Sie Pate und seine Kinder werfen Sie einen Blick auf den Code verstecken hier