Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> Wczytywanie zdjęć bez przeładowania strony
pirates21
post 4.08.2011, 12:44:10
Post #1





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

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

Witam.
Chcę aby po kliknięciu zdjęcia miniaturki załadował się większy obrazek. Chcę to zrobić przy pomocy ajaxowej funkcji getdata(). Problem w tym, zę po kliknięciu w miniaturkę ukazują się tzw. "krzaki" zamiast zdjęcia. Jak to wykonać poprawnie?

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">  
  3.   <head>                      
  4.     <title>jCarousel Examples     
  5.     </title>    
  6.     <!--
  7.         Ajax - getdata();
  8.         -->
  9. <script type="text/javascript" src="../lib/ajax.js"></script>    
  10.   </head>  
  11.   <body>    
  12.     <div id="wrap">      	       
  13.       <div id="imagePane>  
  14.       </div>		                    
  15.       <a href="#" onclick="getdata('../obrazki/1.jpg','imagePane');">          
  16.         <img src="../miniaturki/thumb_1.jpg"></a>                                                                               
  17.     </div>  
  18.   </body>
  19. </html>
[HTML] pobierz, plaintext 


[HTML] pobierz, plaintext 
  1.  
  2. // here we define global variable
  3. var ajaxdestination="";
  4.  
  5. function getdata(what,where) { // get data from source (what)
  6.  try {
  7.    xmlhttp = window.XMLHttpRequest?new XMLHttpRequest():
  8.   		new ActiveXObject("Microsoft.XMLHTTP");
  9.  }
  10.  catch (e) { /* do nothing */ }
  11.  
  12.  document.getElementById(where).innerHTML ="<center><img src='loading.gif'></center>";
  13. // we are defining the destination DIV id, must be stored in global variable (ajaxdestination)
  14.  ajaxdestination=where;
  15.  xmlhttp.onreadystatechange = triggered; // when request finished, call the function to put result to destination DIV
  16.  xmlhttp.open("GET", what);
  17.  xmlhttp.send(null);
  18.   return false;
  19. }
  20.  
  21. function triggered() { // put data returned by requested URL to selected DIV
  22.   if (xmlhttp.readyState == 4) if (xmlhttp.status == 200) 
  23.     document.getElementById(ajaxdestination).innerHTML =xmlhttp.responseText;
  24. }
[HTML] pobierz, plaintext


Ten post edytował pirates21 4.08.2011, 13:42:47
Go to the top of the page
+Quote Post
buliq
post 4.08.2011, 13:33:34
Post #2





Grupa: Zarejestrowani
Postów: 559
Pomógł: 93
Dołączył: 4.03.2008
Skąd: Olsztyn

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

może pokażesz nam coś z tego getdata? mamy wróżyć gdzie masz błąd? smile.gif


--------------------
KTOŚ TU PACZY???

Kompedium wiedzy
Go to the top of the page
+Quote Post
Louner
post 4.08.2011, 13:59:51
Post #3





Grupa: Zarejestrowani
Postów: 99
Pomógł: 5
Dołączył: 20.06.2005
Skąd: Bielsk Podlaski

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

Mnie się wydaje, że pobierasz strumień danych i próbujesz go wyświetlić jak obrazek. Może po prostu pobieraj sam odnośnik do większego zdjęcia i go wyświetlaj? Ewentualnie sprawdź MIME tego co pobierasz, bo może w tym jest błąd. smile.gif
Go to the top of the page
+Quote Post
buliq
post 4.08.2011, 14:20:47
Post #4





Grupa: Zarejestrowani
Postów: 559
Pomógł: 93
Dołączył: 4.03.2008
Skąd: Olsztyn

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

HALO o.0 co ty robish questionmark.gif

document.getElementById(ajaxdestination).innerHTML =xmlhttp.responseText;

Pobierasz zawartość pliku i umieszczasz ją w div questionmark.gif no z tym to się jeszcze nie spotkałem. Przecież masz już informacje o tym gdzie jest pełnych rozmiarów obrazek, powinieneś zatem co najwyżej sprawdzać czy plik tam jest i wstawiać go tak jak wstawiasz loading.gif


--------------------
KTOŚ TU PACZY???

Kompedium wiedzy
Go to the top of the page
+Quote Post
melkorm
post 4.08.2011, 14:38:19
Post #5





Grupa: Zarejestrowani
Postów: 1 366
Pomógł: 261
Dołączył: 23.09.2008
Skąd: Bydgoszcz

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

a ja się za pytam - na jaką cholerę do tego ajax potrzebny? Wystarczy że zmienisz src na "../obrazki/1.jpg" i będzie banglać.


--------------------
Go to the top of the page
+Quote Post
pirates21
post 4.08.2011, 15:34:29
Post #6





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

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

Po raz pierwszy mam do czynienia z technologia Ajax i nie znam nawet podstaw języka. Dlatego mam prośbę o poprawienie tego skryptu. Będę bardzo wdzięczny.
Go to the top of the page
+Quote Post
buliq
post 4.08.2011, 15:52:26
Post #7





Grupa: Zarejestrowani
Postów: 559
Pomógł: 93
Dołączył: 4.03.2008
Skąd: Olsztyn

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

Proszę:

[JAVASCRIPT] pobierz, plaintext 
  1. function getdata(what,where) {
  2. document.getElementById(where).innerHTML ='<center><img src="'+what+'"></center>';
  3. }
[JAVASCRIPT] pobierz, plaintext


o i ajax nie był potrzebny o.0 ?


--------------------
KTOŚ TU PACZY???

Kompedium wiedzy
Go to the top of the page
+Quote Post
pirates21
post 4.08.2011, 15:58:46
Post #8





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

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

Dziękuję buliq. Działa. A powiedz proszę jak to rozwiązać bez Ajax?
Go to the top of the page
+Quote Post
buliq
post 4.08.2011, 16:17:49
Post #9





Grupa: Zarejestrowani
Postów: 559
Pomógł: 93
Dołączył: 4.03.2008
Skąd: Olsztyn

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

Przecież to jest rozwiązanie bez ajaxa smile.gif

Poczytaj co to jest AJAX tutaj. Tutaj dane masz już dostępne więc ajax nie jest potrzebny.


--------------------
KTOŚ TU PACZY???

Kompedium wiedzy
Go to the top of the page
+Quote Post
« Następny starszy · XML, AJAX · 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: 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 Wersja Lo-Fi Aktualny czas: 13.08.2025 - 23:17
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn