[JavaScript] undefinied zamiast wartosci - zasieg ? Opcje

[Octobus]

mam w buttonie na stronie

[HTML] pobierz, plaintext 
OnClick="dod_wiele('157774, 157745, 157714, 157639, 157617, 157584, 157567, 157565, 157563, 157528, 157481, 157420, 157405, 157387, 157235');
[HTML] pobierz, plaintext 

w javascript wyglada to tak:

[JAVASCRIPT] pobierz, plaintext 
function dod_wiele(tablica_)
{
	tablica = tablica_.split(',');
 
	console.log(tablica);
	console.log('length: '+tablica.length);
 
	for(i=0; i < tablica.length; i++){
 
		setTimeout(function() {
			console.log('test 3, id: '+tablica[i]+', product_id: '+jQuery('#produkt_id_'+tablica[i]).val()+', ilosc: '+jQuery('#a_ilosc_'+tablica[i]).val());
		}, i*2000);
	}
}
[JAVASCRIPT] pobierz, plaintext 

i w setTimeout nie przekazuje mi zmiennych. Dokładnie to co wywala przegladarka:

["157774", "157745", "157714", "157639", "157617", "157584", "157567", "157565", "157563", "157528", "157481", "157420", "157405", "157387", "157235"] produkt.js:645
length: 15
(15 razy) test 3, id: undefined, product_id: undefined, ilosc: undefined

musze miec setTimeout bo wykonuje 15 razy okreslony kod z roznymi zmiennymi po ktorym wykonaniu musi byc chociaz chwila przerwy. Tylko czemu jest undefinied ? Zasieg zmiennych ? Juz poltorej godziny sie mecze z roznymi rozwiazaniami i nic ...

[session]

Ja myślę, że problem jest głównie ze zmienną i. Ponieważ setTimeout wykona callback (podaną funkcję) po upłynięciu czasu, a wtedy zmienna i będzie miała wielkość równą ilości elementów w tablicy. Dojdzie do próby wstawienia w tym przypadku tablica[15], a taki element tej tablicy nie istnieje (dlatego undefined). Ogólnie setTimeout zapisuje w pamięci jaką funkcję ma wykonać po upływie określonego czasu wstawiając po tym czasie lokalne zmienne w odpowiednie miejscie. W dodatku ten for owszem wykona się dokładnie tyle razy ile ma tablica elementów, ale w ostatnim obiegu również wykona się i++ przez co wydzie poza tablicę.

Dowód ?

Kod

for(i=0; i < 4; i++){
        setTimeout(function() { alert(i); }, 2000);
    }

Zatem najlepiej inkrementować zmienną wewnątrz funkcji callback.

Kod

i=0;
setTimeout(function() { alert(i); i++; setTimeout(function(){ alert(i);}, 2000); }, 2000);

Czyli typowa rekurencja. W Twoim przypadku najlepiej, abyś to co robi callback umieścił w osobnej funkcji, która będzie ustawiała kolejne timeouty. Każdy następny callback uruchomi kolejne odliczanie czasu zatem nie dajesz wtedy i*2000 tylko samo 2000, ponieważ kolejny timeout zostanie ustawiony po wykonaniu poprzedniego, czyli po 2000ms itd. itd:

Kod

    
function dod_wiele(tablica_){
    tablica = tablica_.split(',');
    console.log(tablica);
    console.log('length: '+tablica.length);
    function showTimeout(tablica, i, l){
      console.log('test 3, id: '+tablica[i]+', product_id: '+jQuery('#produkt_id_'+tablica[i]).val()+', ilosc: '+jQuery('#a_ilosc_'+tablica[i]).val());
        i++;
        if(i < l){
            setTimeout(function() { showTimeout(tablica, i, l); }, 2000);
        }
     }
     showTimeout(tablica, 0, tablica.length);
}

Ten post edytował session 25.05.2015, 19:49:23