JS => Jak To Uprościć?

Dla specjalistów Webmastering
#1

Witam.

Napisałem coś takiego:

, a to wywołuje :

Wersja 1


 Wersja 2


 Wersja 3

Czy wie ktoś jak to uprościć, a zarazem zrobić tak, żeby było bardziej uniwersalne* to rozwiązanie?

uniwersalne - jeżeli dodam nowy label + input, żeby nie zmieniać treści JS.

Z góry dzięki za pomoc. :wink:

#2

Funkcja addEvent Deana Edwardsa do nasłuchu zdarzeń i odwoływanie się w handlerach przez this:

var element = odszukaj_element();


addEvent(element, function() {

   this.className = this.className ? 'toggled' : '';

});

Jedna klasa do przełączania wystarczy, resztą powinien zająć się CSS.

Możesz także zebrać wszystkie elementy do jednej tablicy (NodeList) i przeiterować po niej. Albo skorzystaj z jQuery, jeśli masz więcej kodu, inaczej niezbyt się opłaca :wink: Ewentualnie, jeśli elementy dodajesz dynamicznie i chcesz pod nowo dodany element podpiąć zdarzenie, zainteresuj się event delegation (jQuery wspiera natywnie, chyba ;-)).

PS: Chyba już komuś coś podobnego pisałem na tym forum.

#3

Ogólnie na co dzień zajmuję się PHP i moja wiedza na temat JS jest równa niczemu, ale z tego co widzę to mam napisać funkcję, która sprawdzi mi ile jest input-ów lub label-ów w formularzu ( odszukaj_element() ), a “toggled” to nazwa klasy CSS…tak ?

#4

Niekoniecznie to musi być funkcja, ale musisz jakoś pozbierać elementy, na których chcesz operować. Na przykład za pomocą document.getElementsByTagName, a następnie (jeśli to konieczne) sprawdzić atrybuty w pętli i w ten sposób przefiltrować wyniki.

Nazwa klasy się zgadza, oczywiście :wink:

#5

…no Ok coś pokombinuje… :slight_smile: Jak coś napiszę konkretnego to napiszę na forum:P

– Dodane 24.05.2009 (N) 1:06 –

Zgodnie z obietnicą:

function For(id){

	lab=document.getElementById('F1').getElementsByTagName('label');

	SO=lab.length;

	for(a=0;a<(SO);a++){

	lab[a].className = 'else';

	}

	document.getElementById(id).className = 'wybor';

}

a odpalamy w ten sposób.

Wersja 1

 Wersja 2

 Wersja 3

 Wersja 4

Pozdrawiam :wink: