Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [JavaScript] Zdobywanie wartości id rodzica
sweter
post 30.01.2010, 22:06:11
Post #1





Grupa: Zarejestrowani
Postów: 623
Pomógł: 11
Dołączył: 1.01.2009
Skąd: Wrocław

Ostrzeżenie: (0%)
-----


Witam,

mam taki kodzik:

  1.  
  2. <h5 id="1"><div class="wybrano_l"></div>Menu</h5>
  3. <ul id="i1" class="undermenu">
  4. <li id="1">Menu<div id="w1" class="wybrano_p" style="display:block"></div></li>
  5. <li id="2">Menu<div id="w2" class="wybrano_p"></div></li>
  6. <li id="3">Menu<div id="w3" class="wybrano_p"></div></li>
  7. <li id="4">Menu<div id="w4" class="wybrano_p"></div></li>
  8. <li id="5">Menu<div id="w5" class="wybrano_p"></div></li>
  9. </ul>
  10. <h5 id="2"><div class="wybrano_l"></div>Menu</h5>
  11. <ul id="i2" class="undermenu">
  12. <li id="1">Menu<div id="w1" class="wybrano_p" style="display:block"></div></li>
  13. <li id="2">Menu<div id="w2" class="wybrano_p"></div></li>
  14. <li id="3">Menu<div id="w3" class="wybrano_p"></div></li>
  15. </ul>
  16.  
  17.  


Menu działa w taki sposób:

Domyślnie klasy "undermenu" są niewidoczne(display:none) - widać tylko elementy <h5>.

Po kliknięciu na taki element rozwija się konkretna lista (np. klikam w <h5> z id="1" pokazuje się lista z id="i1").

Następnie można kliknąć wybrany element <li>. Obok niego powinien pojawić się <div> z class="wybrano_p".

Jednak mam problem z tym, że po wybraniu np. <li id="2">, którego rodzicem jest <h5 id="1">, i kliknięciu na <h5 id="2"> Nie ma tam domyślnie zaznaczonej pierwszej pozycji sad.gif

Sądzę, że dobrym rozwiązaniem było by pobranie atrybutu "id" z elementu nadrzędnego <li>, czyli z <h5>. Czy jest to możliwe za pomocą js?

A co Wy o tym sądzicie?

Poniżej zamieszczam kod java script:

Kod
$("H5").click(function(){
                    var id = $(this).attr("id");
                    var stan = $("#i"+id).css("display");
                    if(stan=="none"){
                        $(".wybrano_l").css("rotation","90deg anti-clockwise");
                        $(".undermenu").slideUp("normal");
                        $("#i"+id).slideToggle("normal");
                    }
                });
                
                $(".undermenu > li").click(function(){
                    var id = $(this).attr("id");
                    $(".wybrano_p").hide("fast");
                    $(".undermenu > li").css("font-weight","normal");
                    $(this).css("font-weight","bold");
                    $("#w"+id).show("fast");
                });


Ten post edytował sweter 30.01.2010, 22:09:01


--------------------
Go to the top of the page
+Quote Post
DiH
post 30.01.2010, 23:50:29
Post #2





Grupa: Zarejestrowani
Postów: 251
Pomógł: 34
Dołączył: 7.01.2010

Ostrzeżenie: (0%)
-----


W skrócie: Klikam na nazwę działu, rozwija się podmenu, klikam w link podmenu i po załadowaniu ma być zaznaczony zarówno dział, jak i podział, tak? Jeżeliby całe to Twoje menu wrzucić do jakiejś tablicy, to możnaby je ładnie wypisać w pętli for, przyporządkowując każdemu elementowi inny id, przez co późniejsze zmiany w kodzie byłyby dużo mniej problematycze.

  1. <h5 onClick="fold();unfold('podmenu_1');unfold('dzial_1');unfold('link_1_1');">Link<div id="dzial_1">&nbsp;</div></h5>
  2. <ul id="podmenu_1">
  3. <li><div id="link_1_1">&nbsp;</div></li>
  4. <li><div id="link_1_2">&nbsp;</div></li>
  5. </ul>
  6. ...


  1. Wrzucić do <head>:
  2. function unfold(mytag) {
  3. document.getElementById(+mytag+).style.display = 'block';
  4. }
  5. function fold() {
  6. // tu petla do ukrycia wszystkich innych div'ów
  7. document.getElementById(+tag+).style.display = 'none';
  8. }


Czyli po prostu: najpierw "ukrywamy" wszystkie divy, a potem "pokazujemy" tylko te wybrane.

Ten post edytował DiH 31.01.2010, 00:30:04
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 29.04.2025 - 07:23