Na forum 4programmers.net korzystamy z plików cookies. Część z nich jest niezbędna do funkcjonowania
naszego forum, natomiast wykorzystanie pozostałych zależy od Twojej dobrowolnej zgody, którą możesz
wyrazić poniżej. Klikając „Zaakceptuj Wszystkie” zgadzasz się na wykorzystywanie przez nas plików cookies
analitycznych oraz reklamowych, jeżeli nie chcesz udzielić nam swojej zgody kliknij „Tylko niezbędne”.
Możesz także wyrazić swoją zgodę odrębnie dla plików cookies analitycznych lub reklamowych. W tym celu
ustaw odpowiednio pola wyboru i kliknij „Zaakceptuj Zaznaczone”. Więcej informacji o technologii cookie
znajduje się w naszej polityce prywatności.
Witam, mam problem nie chce mi działać setTimeout w kazdym kroku pętli...
Pierwszy krok jest opozniony o te 5sec a kolejne nr indexu wyświetlaja się jeden po drugim bez Timeout
Proszę o pomoc
$item = $('.dowiesz_sie_list .list_item');
$item.each(function(index) {
var test = $(this).data("id");
setTimeout(function () {
alert(test);
}, 5000);
});
0
Wyświetlają się jeden po drugim tuż po tym pierwszym? ;-)
0
Tak, nie ma pomiędzy nimi tej przerwy 5sekundowej
0
Nie ma pomiędzy nimi przerwy, bo i nic takiego nie zakodowałeś.
Jest pięciosekundowa przerwa od momentu wykonania setTimeout, a że to setTimout wykonujesz jedno po drugim, no to...
1
setTimeout jest asynchroniczne - nie blokuje pętli na czas wykonania - rejestruje się jeden timeout, czeka w tle, pętla leci natychmiast dalej, rejestruje się drugi timeout itd. Czyli w ułamku milisekundy są rejestrowane wszystkie timeouty. Wszystkie wyświetlają Ci się z timeoutem, wbrew temu co Ci się wydaje - tyle że tak jak napisałem - są rejestrowane niemal jednocześnie, polecam:
Żeby rozwiązać Twój problem powinieneś zarejestrować kolejny timeout dopiero w momencie wykonania poprzedniego, czyli nie w pętli wszystkie na raz, tylko w callbacku (rekursywnie w funkcji przekazywanej do timeouta. Np tak:
czy też (jeśli już chcesz się bawić w archeologię) coś w tym stylu:
var $items = $('.example')
recur($items.toArray())
function recur (items) {
var first = items[0]
var rest = items.slice(1)
if (first) {
setTimeout(function () {
console.log(first.dataset.id)
recur(rest)
}, 1000)
}
}
var items = $('.dowiesz_sie_list .list_item');
items.each(function(index) {
var id = $(this).data("id");
setTimeout(function () { console.log(id); }, 5000 * (index + 1));
});
Uwagi do autora: unikaj $ na początku zmiennych a także deklaruj wszystkie zmienne (var), to jest js a nie php. Nazwa "test" jest bardzo słaba. Zamiast alert używaj console.log i konsoli z wbudowanych w przeglądarkę narzędzi webmasterskich (F12 albo Shift+F5), console.log może wypisywać do konsoli znacznie więcej informacji.
0
Dzięki za odpowiedzi ! Sprawdzę po pracy, dopiero siadam do js ale powoli do celu ☺ każda uwaga jest cenna!
0
Witam, działa tak jak chciałem tylko nie wiem jak zrobić zeby petla .each wykonywała się od nowa gdy sie skończy...
Próbowałem różne sposoby i skończyły mi sie pomysły
W takiej formie może to sobie bezpiecznie działać w nieskończoność.
W tym Twoim przykładzie zupełnie bez sensu filtrujesz tablicę itemów dwukrotnie, mając wszystkie potzrebne dane bez tego (index).
Dodatkowo rozwiązanie z dodawaniem setTimout w pętli się nie sprawdzi dla nieskończonego cyklu.
Nie wiem też w sumie po co Ci pola data-id, bo wygląda na to, że to liczby porzadkowe, równie dobrze można skorzystać z indeksów tablicy (jak w przykładzie).
1 użytkowników online, w tym zalogowanych: 0, gości: 1