Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Dynamiczna strona,przesyłanie parametru do funkcji w jQuery
skoranoskorano
post
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 29.06.2011

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

Hej,

grzebię się od dłuższego czasu z napisaniem skryptu podmieniającego zawartość diva na stronie, bez przeładowywania jej.

Mam index.htm gdzie jest menu oraz div id="content" do którego chcę wrzucać fragmenty kodu html
plik content.js gdzie mam kod jQuery
oraz fragmenty kodów do podmiany umieszczone w katalogu content.

teraz tak, fragmenty kodu

na stronie index.htm:
[HTML] pobierz, plaintext 
  1. <div class="menu_element" id="men_witamy">
  2. <a href="#" onClick="loader('witamy');">Witamy!</a>
  3. </div>
  4. <div class="menu_element" id="men_onas">
  5. <a href="#" onClick="loader('onas');">O nas</a>
  6. </div>
  7. <div class="menu_element" id="men_oferta">
  8. <a href="#" onClick="loader('oferta')">Oferta</a>
  9. </div>
  10. <div class="menu_element" id="men_portfolio">
  11. <a href="#" onClick="loader('portfolio')">Portfolio</a>
  12. </div>
[HTML] pobierz, plaintext

i trochę niżej w tym samym dokumencie to:
[HTML] pobierz, plaintext 
  1. <div id="content"><br/>
  2.     Ten tekst zostanie zamieniony    
  3.     </div>
[HTML] pobierz, plaintext



plik content.js:
[JAVASCRIPT] pobierz, plaintext 
  1. function loader(strona) {
  2.  
  3.     switch(strona) { 
  4.         case "witamy": 
  5.         {$('#content').load('content/witamy.html');
  6.         $('#men_witamy').removeClass('menu_element');
  7.         $('#men_witamy').addClass('menu_element_aktywny'); break;
  8.          } 
  9.         case "onas": 
  10.         {$('#content').load('content/onas.html');
  11.         $('#men_onas').removeClass('menu_element');
  12.         $('#men_onas').addClass('menu_element_aktywny'); break;
  13.            } 
  14.         case "oferta": 
  15.         {$('#content').load('content/oferta.html');
  16.         $('#men_oferta').removeClass('menu_element');
  17.         $('#men_oferta').addClass('menu_element_aktywny'); break;
  18.            } 
  19.         case "portfolio": 
  20.         {$('#content').load('content/portfolio.html');
  21.         $('#men_portfolio').removeClass('menu_element');
  22.         $('#men_portfolio').addClass('menu_element_aktywny'); break;
  23.          } 
  24.         default: 
  25.         { $('#content').load('content/witamy.html');
  26.          $('#men_witamy').removeClass('menu_element');
  27.         $('#men_witamy').addClass('menu_element_aktywny');
  28.  
  29.         } 
  30.     }
[JAVASCRIPT] pobierz, plaintext



w jaki sposób to działa: http://tonika132.home.pl/krzychu/web
coś mi się kopie, nie wiem w czym leży problem


nie działa najwyraźniej przesyłanie parametru do funkcji,

zastanawiam się też, jaki kod dodać do jQ aby po wybraniu innego elementu menu, klasy poprzednio wybranych elementów wracały do normy.

Proszę o pomoc smile.gif

Ten post edytował skoranoskorano 29.06.2011, 10:20:25
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 5)
Theqos
post
Post #2





Grupa: Zarejestrowani
Postów: 49
Pomógł: 8
Dołączył: 5.12.2008

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

a słyszał kolega o
Kod
break
w switchu i co to robi?

PS. tutaj może masz z breaki, ale w content.js ich nima wink.gif

Ten post edytował Theqos 29.06.2011, 10:33:46
Go to the top of the page
+Quote Post
skoranoskorano
post
Post #3





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 29.06.2011

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

Dzięki, grzebałem w tym kodzie i bez sensu powywalałem break;

A jakiś pomysł, jak zgrabnie napisać kod, aby przywracać klasy poprzednie w momencie wybrania nowego elementu?
Tak aby nie dopisywać w każdym case wszystkich przypadków
Go to the top of the page
+Quote Post
Theqos
post
Post #4





Grupa: Zarejestrowani
Postów: 49
Pomógł: 8
Dołączył: 5.12.2008

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

Zapisz sobie aktywny element w jakiejs zmiennej to po kliknieciu będziesz wiedział co przestanie być aktywne wink.gif
Go to the top of the page
+Quote Post
skoranoskorano
post
Post #5





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 29.06.2011

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

zmieniłem kod na takie coś:

w index.htm:
[HTML] pobierz, plaintext 
  1. <body onLoad="start_loader()">
[HTML] pobierz, plaintext


i niżej:
[HTML] pobierz, plaintext 
  1. <div class="menu_element" id="witamy"><a href="#" onClick="loader('witamy');">Witamy!</a></div>
  2. 	<div class="menu_element" id="onas"><a href="#" onClick="loader('onas');">O nas</a></div>
  3. 	<div class="menu_element" id="technologie"><a href="#" onClick="loader('technologie');">Technologie</a></div>
  4. 	<div class="menu_element" id="oferta"><a href="#" onClick="loader('oferta')">Oferta</a></div>
  5. 	<div class="menu_element" id="portfolio"><a href="#" onClick="loader('portfolio')">Portfolio</a></div>
  6. 	<div class="menu_element" id="elementy"><a href="#" onClick="loader('elementy')">Elementy</a></div>
  7. 	<div class="menu_element" id="kontakt"><a href="#" onClick="loader('kontakt')">Kontakt</a></div>
  8.  
[HTML] pobierz, plaintext




natomiast w pliku js:
[JAVASCRIPT] pobierz, plaintext 
  1. var strona_old ="";
  2. function start_loader(){
  3. 	$('#content').load('content/witamy.html');
  4. 	$('#witamy').removeClass('menu_element');
  5. 	$('#witamy').addClass('menu_element_aktywny');
  6. 	strona_old = '#witamy';
  7. 	return strona_old;
  8.  
  9. 	}
  10.  
  11.  
  12. function loader(strona) {
  13.  
  14. $('#content').load('content/' + strona + '.html');
  15. $('#'+strona).removeClass('menu_element');
  16. $('#'+strona).addClass('menu_element_aktywny');
  17. $('#'+strona_old).removeClass('menu_element_aktywny');
  18. $('#'+strona_old).addClass('menu_element');
  19.  
  20. strona_old = strona;
  21. return strona_old;
  22. }
[JAVASCRIPT] pobierz, plaintext



działa to następująco: http://tonika132.home.pl/krzychu/web/

tak jakby nie działało return strona_old w 2 funkcji
bo nie reaguje ('#'+strona_old).addClass i removeClass

Czy dobrze przypisałem strona_old = strona; questionmark.gif?
A może return źle zapisany,

szukałem w sieci, na poradnikach, kursach książkach, nic nie znalazłem

Ten post edytował skoranoskorano 29.06.2011, 14:11:36
Go to the top of the page
+Quote Post
Theqos
post
Post #6





Grupa: Zarejestrowani
Postów: 49
Pomógł: 8
Dołączył: 5.12.2008

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

Hmm, akurat te returny są niepotrzebne. Nie za bardzo wiem o co ci chodzi, bo przecież nigdzie nie używasz wartości zwracanej przez te funkcje. Pozatym u mnie stronka działa jak należy.
Go to the top of the page
+Quote Post
« Następny starszy · JavaScript · Następny nowszy »
 

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

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 20.08.2025 - 09:58
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn