Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JS, PHP] Zmiana elementów strony bez przeładowania
R_Przemek
post
Post #1





Grupa: Zarejestrowani
Postów: 35
Pomógł: 0
Dołączył: 25.06.2006
Skąd: Dąbrowa Górnicza

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

Witam

Chciałem zmieniać pewne elementy strony bez jej przeładowania. Zasadniczo ładowanie pliku PHP do div jest proste, jednak ja chciałem zmieniać na przykład background-color jakiegoś elementu albo na przykład value jakiegoś buttona.

Konkrety:

Mam 16 divów, które wyświetlam o tak:

[PHP] pobierz, plaintext 
  1. <?php 
  2.  for ($i = 1; $i <= 16; $i++) { 
  3. ?>
  4. 	<div  class="pozition_ster_manual_c" id="<?php echo "pozition_ster_manual_c_$i"; ?>"> <?php echo "zawartosc diwa"; ?>
  5. 	</div>
  6. <?php 
  7. }
  8. ?>
[PHP] pobierz, plaintext


I teraz aby moje divy miały odpowiedni kolor tła, który ma się zmieniać w zależności od efektu działania skryptu php z interwałem co sekundę (to znaczy z opóźnieniem sekundowym) powyżej robię tak:


najpierw:

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML>
  2. <html lang="pl">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>Sterownik v1.0</title>
  6. <link rel="Stylesheet" type="text/css" href="style.css" />
  7. <script src="jquery.min.js"></script>
[HTML] pobierz, plaintext


potem:

[HTML] pobierz, plaintext 
  1. <script type="text/javascript">
  2.  
  3. var my_v;
  4. var stepp;
  5.  
  6.  
  7. function bla() {
  8.  
  9. for (step = 1; step <= 16; step++) {
  10.  
  11. 	stepp = step;
  12.  
  13. //dane z php do zmiennej
  14.  $.get('wykonaj.php?action=read&pin='+stepp, function( my_var ) {
  15.  
  16. 	 my_v = my_var;
  17.  
  18. 	    if (my_v == '0') {
  19. 	   document.getElementById("pozition_ster_manual_c_"+stepp).style.backgroundColor = "green";
  20.       }
  21.         if (my_v == '1') {
  22. 	   document.getElementById("pozition_ster_manual_c_"+stepp).style.backgroundColor = "red";
  23.       }
  24.  
  25. }); 
  26. //dane z php do zmiennej
  27.  
  28.  
  29.  
  30. }//-for
  31.  
  32.     setTimeout("bla()", 1000); //<--- czas odswiezania
  33. }
  34. $(document).ready(function(){ // wyzwolenie autoodswierzania
  35.   bla();
  36. });
  37.  
  38. </script>
[HTML] pobierz, plaintext


W obecnej postaci skrypt szaleje, albo po prostu nie działa.

Jak to ma działać:

Skrypt wykonaj.php sprawdza stan pinów gpio, w efekcie zwraca "0" bądź "1".
czyli jeśli chcę znać stan pinu 1 wykonuję "wykonaj.php?action=read&pin=1" i dostaję 0 albo 1 i od tego uzależniam kolor tła wyświetlonego później diva.

skrypt działa jeśli testowo usuwam pętle "for (step = 1; step <= 16; step++) {" i na sztywno definiuję zmienną $stepp na przykład na "6"
wtedy div o id xyz_6 zmienia kolor tła.

Czy ktoś ma pomysł gdzie popełniam błąd ?
Go to the top of the page
+Quote Post
kajzur
post
Post #2





Grupa: Zarejestrowani
Postów: 385
Pomógł: 26
Dołączył: 22.03.2008
Skąd: TM

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

$.get jest asynchroniczne więc nim wykona się Twój callback pętla przejdzie już dalej. Stąd dostajesz średni efekt (IMG:style_emoticons/default/tongue.gif) rozwiązanie to np. niech Twój plik php zwraca wszystkie 16 wartości a nie jedną dla każdego. Wtedy masz jednego $.get'a i w jego callbacku zrobisz tego fora ;p
Go to the top of the page
+Quote Post
« Następny starszy · Po stronie przeglądarki · Następny nowszy »
 

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

 

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

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

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