Forum PHP.pl > [jQuery] Problem z rozwijaniem wszystkich parentów.

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [jQuery] Problem z rozwijaniem wszystkich parentów.

Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript

MMX3

6.05.2008, 13:14:46

Witam,

Mam mały problem.

Posiadam drzewo kategorii. w tym stylu:

[HTML] pobierz, plaintext 
<ul class='ps_lvl_1'>
 <li>kat 0</li>
 <li>kat 1</li>
 <li>kat 2</li>
 <li>kat 3
  <ul class='ps_lvl_2'>
    <li>sub kat 0</li>
    <li>sub kat 1
     <ul class='ps_lvl_3'>
      <li class='current'>sub sub kat 0</li>
     </ul>
    </li>
     <li>sub kat 2</li>
  </ul>
</li>
[HTML] pobierz, plaintext

Wszystko działa slideToggle również. Teraz tylko chodzi mi o coś takiego. żeby rozwinąć wszystkich rodziców elementu li z klasą current.

Kombinowałem z takim czymś:

[HTML] pobierz, plaintext 
$('ul.ps_lvl_1').children('li.current ul.ps_lvl_2').slideDown('fast');
[HTML] pobierz, plaintext

Oraz

[HTML] pobierz, plaintext 
$('ul.ps_lvl_1').next('li.current ').slideDown('fast');
[HTML] pobierz, plaintext

Generalnie pogubiłem się z selektorami... Czy ktoś mógł by na to rzucić trochę świeżego spojżenia, bo ja już wymiękam.

Pozdrawiam,
mmx3

nospor

6.05.2008, 13:26:34

powinienes uzyc HAS:
http://docs.jquery.com/Selectors/has#selector

MMX3

6.05.2008, 13:29:43

a mogę zrobić has(ul li.current) ?

nospor

6.05.2008, 13:30:42

a nie wystarczy: has(li.current) ?
Pozatym nie mozesz sprawdzic?

MMX3

6.05.2008, 14:06:05

może trochę za mało napisałem. wstępu.

Chodzi o coś takiego, że widoczne są jedynie listy klasy ps_lev_1. Po kliknięciu rozwijają się podlisty. Po kliknięciu na link

[HTML] pobierz, plaintext 
<li><img src='plus.gif' alt='expand' /><a href='link do storny kategorii'>Kat 0</a></li>
[HTML] pobierz, plaintext

Wyświetla się menu i na kliknięty element php dodaje klase current. Teraz chcę rozwinąć wszystkie listy (max 3 levele)
przez które przeklikał user.

już wymyśliłem...

[HTML] pobierz, plaintext 
$('ul.ps_lvl_1 li.current ul.ps_lvl_2').show('fast');
    $('ul.ps_lvl_2 li.current ul.ps_lvl_3').show('fast');
    $('ul.ps_lvl_2 li.current ul.ps_lvl_3').parents().show('fast');
    $('ul.ps_lvl_2 li.current ul.ps_lvl_3').parents().addClass('current');
    $('ul.ps_lvl_3 li.current').parents().show('fast');
    $('ul.ps_lvl_3 li.current').parents().addClass('current');
[HTML] pobierz, plaintext

has nie zadziałało

tiraeth

6.05.2008, 22:06:25

Czyli chcesz rozwinąć wszystkie elementy, które prowadzą do .current?

Kod

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <script type="text/javascript" src="jq.js"></script>
        <script type="text/javascript">
            function recursiveHide(sElement) {
                sElement.hide();
                if ( sElement.children().length > 0 ) {
                    recursiveHide(sElement.children());
                }
            }

            $().ready(function(){
                recursiveHide($('.ps_lvl_1'));
                $('.current').show().parents().show();
            });
        </script>
    </head>
    <body>
        <ul class='ps_lvl_1'>
            <li>kat 0</li>
            <li>kat 1</li>
            <li>kat 2</li>
            <li>kat 3
                <ul class='ps_lvl_2'>
                    <li>sub kat 0</li>
                    <li>sub kat 1
                        <ul class='ps_lvl_3'>
                            <li class='current'>sub sub kat 0</li>
                        </ul>
                    </li>
                    <li>sub kat 2</li>
                </ul>
            </li>
        </ul>
    </body>
</html>

No to trzym

Działa chyba tak jak powinien. Oczywiście bez auto-slideToggle, ale samo slideToggle zadziałać powinno jako dodatek

edit: Na poczekaniu powstało jeszcze to: http://dpaste.com/hold/48582/ Uważam, że bardziej chyba o to chodziło

W każdym bądź razie inwencja + docs.jquery.com i wszystko będzie git

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.