Sakrivanje i prikazivanje panela

Odgovori Nova tema

4 odgovora
2.495 pregleda

Sakrivanje i prikazivanje panela 14.02.2011. u 01:32 · pre 191 mesec #1

Pozdrav svima,

Imam sledeci jednostavan HTML kod:

Code:
<ul>
  <li>Root 1</li>
  <li><a onclick="flipChilds();">Root 2</a></li>
    <ul>
      <li>Child 1</li>
      <li>Child 2</li>
    </ul>
  <li>Root 3</li>
</ul>

Zeleo bih da kada korisnik klikne na A tag, da se UL koji je ispod njega prikazuje/sakriva. Nesto dakle kao stablo u Windows Exploreru.

Kako ovo mogu da uradim ali da ni tagu A i ni tagu UL-u ne dam id atribut.

Da li je nesto moguce uraditi uz pomoc NextSibling-a ili sl?

Pozdrav i hvala

Re: Sakrivanje i prikazivanje panela 14.02.2011. u 13:24 · pre 191 mesec #2

Uz pomoć jQuery-ja, sve možeš da završiš sa samo par linija koda:

Code:
$('ul li a').click(function() {
$(this).parent('li').next('ul:first').toggle();
});

btw Taj tvoj HTML markup baš i nije po "udžbeniku", jer se liste obično ugnježdavaju na ovaj način:

Code:
<ul>
  <li>Root 1</li>
  <li><a onclick="flipChilds();">Root 2</a>
    <ul>
      <li>Child 1</li>
      <li>Child 2</li>
    </ul>
</li>
<li>Root 3</li>
</ul>

Obrati pažnju gde je zatvoren taj drugi li tag. U tom slučaju, taj parent('li') segment u JS kodu sa početka ovog post-a je suvišan.

Re: Sakrivanje i prikazivanje panela 14.02.2011. u 17:08 · pre 191 mesec #3

Nazalost moram da napravim da radi bez jQuery-a. Da li je to moguce?

Hvala na ispravci, promaklo mi je.

Hvala

Re: Sakrivanje i prikazivanje panela 15.02.2011. u 22:09 · pre 191 mesec #4

Naravno da jeste, jQuery je baziran na obicnom Javascript kodu.

Potpis

:: Nemoj se svadjati sa budalom, ljudi cesto nece primjetiti razliku ::

Re: Sakrivanje i prikazivanje panela 15.02.2011. u 22:20 · pre 191 mesec #5

Ne znam zbog čega bi želeo da ukloniš jQuery?
Šta mu fali? Imaš mini pakete,mali su,kompaktni... A omogućava mnogo,mnogo,mnogo stvari!

Prijavite se da biste odgovorili u ovoj temi.Prijava Registracija

Forum kao aplikacija na telefonu

Srodne teme