Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: problem z pętlą
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
shpyo
Mam sobie funkcję, która przypisuje obrazkom, w sposób dynamiczny akcje po najechaniu i zjechaniu myszką:

Kod
function change( id, img, url, kid )
{
    var tab = new Array();
    tab[0] = './images/k_demo_on.jpg';
    tab[1] = './images/k_makler_on.jpg';
    tab[2] = './images/k_ekomako_on.jpg';
    tab[3] = './images/k_biuro_on.jpg';

    for(var z=1;z<=4;z++)
    {
        if( z == kid )
        {
            document.getElementById('kb' + z).src = tab[z-1];
            document.getElementById('kb' + z).onmouseover = function() { changePic( z, false, false ); }
            document.getElementById('kb' + z).onmouseout = function() { changePic( z, false, false ); }
        }
        else
        {
            document.getElementById('kb' + z).onmouseover = function() { changePic( z, true, false ); }
            document.getElementById('kb' + z).onmouseout = function() { changePic( z, false, true ); }
        }
    }
}


Problem powiaja się w warunku ELSE, gdzie zmienna "z" zawsze przyjmuje wartość "5" ;/.
Czy wie ktoś dlaczego się tak dzieje?

pozdr,
abc667
dzieję się tak ponieważ funkcja zdefiniowania dla zdarzenia onmouseover pobiera wartość zmiennej z, po zakończeniu w/w pętli z zawsze masz wartość 5 więc wszędzie gdzie został przypisana ta funkcja zostanie ona wywołana z argumentem 5,

1. lepiej używać funkcji addEvent()
2. skoro twoje elementy mają wspólny początek możesz podczas wywoływania pobierać ich numer

  1. document.getElementById('kb' + z).onmouseover = function() { changePic( false, false ); }


i w funkcji changePic usuń pierwszy argument i na początku np dodaj

  1. var str = this.id;
  2. var idk = str.slice(2);


i teraz w funkcji wykorzystuj idk (oczywiście możesz sobie zmienić nazwę)

p.s.

wersja z funkcją addEvent()
  1. addEvent( document.getElementById('kb' + z), 'mouseover', function() { changePic( false, false );});
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.