Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: JS+PHP - menu drzewiaste proszę o pomoc !
Forum PHP.pl > Forum > Po stronie przeglądarki
pusti
Witam
Użyłem skryptu drzewa ze strony http://www.kurshtml.boo.pl/skrypty/menu_drzewiaste.html ,skrypt chodzi pięknie tylko mam jeden problem którego nie mogę rozwiązać ze względu na słabą znajomość JS. W jaki sposób przerobić ten skrypt żeby gałąź po kliknięciu nie tylko rozwijała listę ul ale także była odnośnikiem powiedzmy do opisu gałęzi. Dodam że struktura menu jest generowana przez funkcje rekurencyjną z bazy danych (kod poniżej ) .Bardzo proszę o pomoc

  1. function display_menu($parentID, $tab,$i) {
  2.  
  3. $i++
  4.  
  5. if (!is_array($tab[$parentID])) return ;
  6.  
  7. echo '<ul id="tree'.$i.'" class="tree">'."\n";
  8.  
  9. foreach ($tab[$parentID] as $element) {
  10.  
  11. if($element['link']>0){
  12.  
  13. echo '<li><a href="?id='.$element['link'].'">'.$element['name'].'</a>';
  14.  
  15. }
  16.  
  17. else {
  18.  
  19.  
  20. echo '<li><a href="java script:void(0)">'.$element['name'].'</a>';
  21.  
  22. }
  23. display_menu($element['id'], $tab,$i);
  24.  
  25. $i++
  26.  
  27. echo '</li>'."\n";
  28.  
  29. }
  30. echo '</ul>';
  31. }
mortus
Witam. Po pierwsze dodaj znaczniki BBCode do Twojego pierwszego postu. Odnośnie problemu, to do uzyskania odpowiedniego efektu musiałbyś użyć AJAX-a, w przeciwnym przypadku strona będzie się przeładowywać i żądany efekt nie będzie widoczny. Linijka
  1. echo '<li><a href="java script:void(0)">'.$element['name'].'</a>';
odpowiada za wyświetlenie gałęzi rodzica i należałoby ją odpowiednio zmodyfikować np.:
  1. echo '<li><a href="#'.$element['link'].'" onclick="loadDescription(); return false;">'.$element['name'].'</a>';
Natomiast funkcja loadDescription() powinna pobierać dane za pomocą AJAX-a i modyfikować zawartość odpowiedniego elementu (tutaj przyda się atrybut innerHTML). Jeżeli jesteś "zielony" w temacie JS i AJAX-a (bo jedno z drugim się łączy), to polecam poczytać choćby na Wikipedii lub poszukać informacji u wujka Google. Najlepiej mimo wszystko zacząć od podstaw. A jak już opanujesz podstawy, to zainteresuj się jakimś frameworkiem JavaScript (większość ma zaimplementowaną obsługę AJAX-a). Ja osobiście polecam jQuery.
pusti
witam
ponownie
Ok udało mi się to zrobić z wykorzystaniem jquery ( funkcja load () ) . Linkom nadałem klasę btn oraz atrybut hreff,
Kod
$(document).ready(function(){
  $('.btn').click(function(){
    
    var id = $(this).attr("hreff");
    $('#box').load('data.php', {index: id}
);
    return false;

  });
});



CHciałbym jeszcze aby podczas ładowania treści wyskakiwał gif animujący ładowanie , jak coś takiego wykonać ?
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.