Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] Pobranie wysokość wczytanego obrazka - ajax
Forum PHP.pl > Forum > XML, AJAX > AJAX
drzalek
Witam,
Mam taki oto problem:
Chciałbym pobrać wysokość obrazka, który został wczytany za pomocą jquery do kodu strony. Niestety mój skrypt nie działa zbyt dobrze. Wysokość zostaje pobrana prawidłowo tylko wtedy, gdy zdjęcie było już wcześniej wczytane na stronie, jeśli zdjęcie ładuje się po raz pierwszy zostaje pobrana wartość 20, czyli taka jak wtedy gdy nie ma żadnej fotki.

Kod jquery przedstawia się następująco:

  1. $('#navigator li a').click(function(){
  2.  
  3. katalog = $(this).attr('href');
  4.  
  5. $.get('photo.php',{'id' : $(this).attr('href')}, function(data){
  6. //zwraca liste zdjec odseparowanych srednikiem
  7. var separator = ';';
  8. $i=0;
  9. galeria = data.split(separator); //tworzy tablice ze wszystkimi zdjeciami z danej galerii
  10.  
  11. element = '<img src="galerie/'+katalog+'/'+galeria[$i]+'" alt="fotografia" id="photo"/>'
  12.  
  13.  
  14. $('#photo').replaceWith(element);
  15.  
  16. });
  17.  
  18. var height = $('#photo').height(); //wysokosc obrazka po wczytaniu
  19.  
  20. alert(height);
  21.  
  22. return false;
  23. });
  24.  
  25. $('#next-container img').click(function(){
  26.  
  27. $i = $i + 1;
  28. if($i>=galeria.length-1){
  29. $i = 0;
  30. }
  31.  
  32. var element = '<img src="galerie/'+katalog+'/'+galeria[$i]+'" alt="fotografia" id="photo"/>'
  33. //alert(element);
  34.  
  35. $('#photo').replaceWith(element);
  36.  
  37.  
  38.  
  39. var height = $('#photo').height(); //wysokosc obrazka po wczytaniu nast zdjecia
  40. alert(height);
  41. return false;
  42. });


id photo to identyfikator zdjęcia ładowanego na stronie.
Czy ktoś ma może jakiś pomysł na rozwiązanie problemu?
krowal
Zastąp odpowiednie linijki tym kodem:
1. $('#navigator li a').live('click', function(){ ...
25. $('#next-container img').live('click', function(){ ...

Powinno pomóc
everth
Popraw adres obrazka bo chyba nie jest prawidłowy. Użyj natywnego JS Image zamiast wpisywać kod obrazka w HTML. Jeśli przeglądarka jest normalna to powinna pobrać obrazek a atrybuty width i height ustawić na jego właściwe wymiary.
drzalek
Dzięki za odpowiedzi.
Zamieniłem replaceWith na takie coś:
  1. document.getElementById("photo").src='galerie/'+katalog+'/'+galeria[$i];


Teraz działa prawie dobrze, tzn. zwraca poprawne wartości wysokości obrazka, ale bierze ten poprzednio wczytany, a nie ten który jest obecnie pobierany, czyli w efecie problem nadal istnieje sad.gif
everth
Pomyśl co to robi
[JAVASCRIPT] pobierz, plaintext
  1. img = new Image();
  2. img.src='http://images3.wikia.nocookie.net/__cb20060203180427/nonsensopedia/images/1/14/Informatyk_w_pracy.gif';
  3. img.alt='';
  4.  
  5. alert(img.height);
  6. alert(img.width);
  7. $('#photo').replaceWith(img);
[JAVASCRIPT] pobierz, plaintext

drzalek
Nie zrozumiałem za pierwszym razem o co Ci chodziło. Teraz w zasadzie działa, niestety zdarza się czasami - nie zawsze, że przy wczytaniu nowego zdjęcia zostaje jeszcze wysokość ze starego. Nie wiem czym może to być spowodowane.
Dzięki za pomoc.
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.