[JQ] Usuniecie 2-ch elementow, rodzic i 1 krok po drzewie DOM Opcje

[Kostek.88]

Witam, mam taki kod:

[HTML] pobierz, plaintext 
            <dl id="maintabs">
                <dt id="tab1">Tab 1<a href="#" class="close">x</a></dt> 
                <dd>
                    Content 1<br />
                    Content 1<br />
                    Content 1<br />
                </dd>
            </dl>
[HTML] pobierz, plaintext 

i usuwam poleceniem (linkn z klasa close) zakladke

[HTML] pobierz, plaintext 
 $(this).parent('dt').remove();
[HTML] pobierz, plaintext 

Wszystko dobrze, ale potrzebuje drugiego polecenia, zeby usunac DD. Dodawanie klas odpada, bo zakladek ma byc wiele, maja byc rozne/dynamiczne.

Czy ma ktos jakies pomysly? Probowalem .parents(), .parent().parent, .parent(2), .closest(), .find(), ale moje wysilki spelzly na niczym...

Ten post edytował Kaloryfer 1.11.2011, 17:43:41

[esp]

A może tak (zakładając że klikasz class=close):

[JAVASCRIPT] pobierz, plaintext 
    $(function (){
        $(".close").click(function(){
 
            $(this).parent().siblings().remove();
        });
    });
[JAVASCRIPT] pobierz, plaintext 

[Kostek.88]

Przetestowalem te funkcje, ale daje rezulat, ze usuwane sa wszystkie zakladki wraz z trescia z wyjatkiem tej zakladki ktora kliknalem... sprobowalem przefiltrowac to po jakims tagu, ale tez bez zmian... przeczytalem tu http://api.jquery.com/siblings/ , ale moim zdaniem to nie ta funkcja. Ma ktos inne pomysly badz po prostu naprowadzi mnie na cos innego? Pozdrawiam (IMG:style_emoticons/default/smile.gif)

[mortus]

To może po prostu:

[JAVASCRIPT] pobierz, plaintext 
$(function() {
 $(".close").click(function(){
  $(this).parent('dt').remove();
  $(this).parent('dd').remove();
 });
});
[JAVASCRIPT] pobierz, plaintext 

Pamiętaj, że .remove() powoduje usunięcie elementu HTML ze struktury DOM. Jeśli chcesz ukryć element zastosuj .hide().

[Kostek.88]

Spojrz na moja strukture. Rodzicem dla a.close jest tylko DT. DD jest poza DT, rodzicem dla DT jest natomiast DL. Mozna wejsc 2 poziomy wyzej, dac .find('dd').remove, ale usuwa wszystkie DD, a jak wspomnialem - dodawanie klas odpada...

Mnie potrzebny jest remove, gdyz na stronie ma byc otwartych wiele zakladek z innymi zakladkami + wiele opcji na nich. Ladowanie tresci do zakladek ma odbywac sie za pomoca AJAX lub prostego .load()

PS. Ten kod dziala tak, ze usuwany jest tylko rodzic DT (sama zakladka). Niestety nie usuwa zawartosci (DD)...

Ten post edytował Kaloryfer 2.11.2011, 10:40:29

[mortus]

No tak, zresztą podany wyżej skrypt i tak nie działa, bo jak już usuniesz element HTML, to nie masz do niego dostępu poprzez this. Trzeba zrobić tak:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function(){
 $(".close").live("click", function(){
  $(this).parent().next("dd").remove();
  $(this).parent().remove();
 });
});
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował mortus 2.11.2011, 11:14:59

[Kostek.88]

Dzieki stary (IMG:style_emoticons/default/smile.gif) Ze tez nie wpadlem na .next(). A napisz mi, jak mozesz, jeszcze jedno:

1) dlaczego w tym przykladzie uzyles $(document).ready zamiast po prostu $( ?

2) jaka w tym wypadku roznice robi live w 2. linijce?

Pozdrawiam

[mortus]

1. Z przyzwyczajenia.
2. Jeśli zakładki będą się również pojawiać, to aby obsłużyć zdarzenie kliknięcia x po pojawieniu się takowej zakładki trzeba jej przypisać to zdarzenie za pomocą JS. W czystym JS trzeba trochę "pokombinować", w jQuery wystarczy nam .live().

[Kostek.88]

Dzieki, juz wszystko wiem (IMG:style_emoticons/default/smile.gif)