JavaScript - Odczytanie atrybutu ALT ze znacznika IMG


(Kontakt) #1

Jak za pomocą JavaScript odczytać atrybut ALT ze znacznika IMG?

[/code]




Chce w ten sposób dodać komentarze pod zdjęciami w galerii.



Przykład działania: http://www.zsrckpswidwin.pl/temp

Pliki użyte w galerii: http://www.zsrckpswidwin.pl/#%%#$#



Chodzi o wyświetlanie czegoś w takim stylu:

[code]Zdjęcie # z #. Tutaj Komentarz odczytany z ALT.


(Spam) #2

Przede wszystkim nie rozróżniasz atrybutu „alt” od „title” – tylko drugi z nich jest odpowiedni na umieszczenie komentarza do obrazka.

Natomiast sam komentarz pobierasz, korzystająć z metody „getAttribute()”, czyli może to być na przykład:

obrazek[i].getAttribute("title");

Gdzie „obrazek” to tablica zawierająca elementy „img”. Po tablicy poruszasz się, korzystając z pętli „for”. Zaś jeśli chodzi o wstawienie zawartość atrybutu, skorzystaj z „appendChild” oraz „createTextNode”, czyli na przykład:

etykieta.appendChild(document.createTextNode(komentarz));

(Kontakt) #3

Jeśli chodzi o to, to oba atrybuty rozrózniam. Nie chce niepotrzebnie dublować znaczników - tytuł po najechaniu na obrazek nie jest mi potrzebny. Ma on sie pojawiac dopiero po wywołaniu skryptu galerii.

Jeśli chodzi o JS, to jestem zielony, jakbyś mógł na podanym przykładzie zaprezentować działanie tej funkcji (w oparciu atrybut ALT), to byłbym bardzo wdzięczny.


(Spam) #4

Jeśli „title” ci przeszkadza, ewentualnie możesz go usunąć z poziomu JavaScript, ale nie będę się aż tak upierał przy tym.

Przyznam się bez bicia, że znam biblioteki, z której korzystasz (preferuję inne frameworki :slight_smile: ), ale takie coś powinno zadziałać:

// if image is part of set display 'Image x of x' 

		var komentarz;

		if(imageArray.length > 1){

			Element.show('numberDisplay');

			komentarz = imageArray[activeImage].getAttribute("alt");

			komentarz = (komentarz) ? komentarz : '';

			Element.setInnerHTML( 'numberDisplay', "Zdjęcie " + eval(activeImage + 1) + " z " + imageArray.length + ". " + komentarz);

		}

Znajdź odpowiedni fragment kodu i go podmień. Nie testowałem, czy działa :slight_smile: Linia:

komentarz = (komentarz) ? komentarz : '';

zabezpiecza przed paskudnym „null” w opisie, gdyby atrybut „alt” nie istniał.


(Kontakt) #5

Po dokonaniu modyfikacji wyświetlane jest tylko zdjęcie, natomiast to co było poniżej już się nie pojawia. (Zmodyfikowane pliki pod tymi samymi adresami).


(Spam) #6

A spróbuj zamienić:

komentarz = imageArray[activeImage].getAttribute("alt");

na:

komentarz = imageArray[activeImage][1].getAttribute("alt");

(Kontakt) #7

Nadal to samo... :frowning:


(Spam) #8

Odpal oryginalny (niezmodyfikowany) plik JS i dodaj obrazkowi dowolny atrybut „title”. Potem sprawdź, czy opis się wyświetla. Jeśli tak, będzie znacznie łatwiej zamienić „title” na „alt”.


(Kontakt) #9
Zdjęcie # z #.

I nic więcej...

Istnieje jakaś możliwość, aby uzyskać efekt, o którym wcześniej wspomniałem?