Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Zagnieżdżenie pętli
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
Krisu
  1. handlers.each(function(index){
  2.  
  3. for (i = 2; i <= items.length; i++) {
  4.  
  5. this.cls = (index === 0 ) ? 'tab first-tab active' : 'tab tab'+ [i] + ''
  6.  
  7. }
  8.  
  9. title += '<li class="' + this.cls + '">'
  10. title += $(this).html()
  11. title += '</li>'
  12.  
  13. });


Mam taką oto funkcję, docelowo chodzi mi o to by kolejne listy li przyjmowały w nazwie klasy numery kolejne. W chwili gdy pętlę zrobię w ten sposób zwraca mi tylko końcową wartość pętli. Niestety na JS za bardzo się nie znam i nie mam pomysłu jak zagnieździć pętle by dobrze zliczała.

trueblue
Zwraca końcową, bo umieściłeś fragment kodu poza pętlą.

Jeśli znasz się na PHP, to tam działanie pętli jest analogiczne.
Krisu
  1. handlers.each(function(index){
  2.  
  3. title += '<li class="' + for (i = 2; i <= items.length; i++) { this.cls = (index === 0 ) ? 'tab first-tab active' : 'tab tab'+ [i] + '' } + '">'
  4. title += $(this).html()
  5. title += '</li>'
  6.  
  7. });


Wiem o tym, najchętniej zbudowałbym to w ten sposób jak powyżej i pewnie byłoby po problemie, ale nie wiem jak w JS składniowo poprawnie to zapisać...
trueblue
A nie myślałeś, aby wstawić te 3 linijki przed zamknięciem klamry pętli?
Krisu
Wówczas rzeczywiście działa, jednak funkcja także powiela same zakładki i zamiast listy o nazwie artykuł 1, artykuł 2, artykuł 3, mam listy artykuł 1, artykuł 1, artykuł 1, artykuł 2, artykuł 2, artykuł 2 itd.
trueblue
Co masz w handlers, co masz w items?
Sam each to już struktura pętli, a w niej tworzysz drugą.

Zobacz ten przykład:
https://jsfiddle.net/waawL47y/

Nie wiem czy jest poprawny, bo Ty tworząc pętlę w jednej iterujesz chyba po wszystkich elementach <li> (zakładam, że w handlers są wszystkie), a w drugiej iterujesz od 3-ego elementu (for).
Krisu
Dziękuję bardzo za pomoc smile.gif Wystarczyło zrezygnować z fora i skorzystać ze zmiennej index

  1.  
  2. handlers.each(function(index){
  3.  
  4. this.cls = (index === 0 ) ? 'tab first-tab active' : 'tab tab'+ [index] + ''
  5.  
  6. title += '<li class="' + this.cls + '">'
  7. title += $(this).html()
  8. title += '</li>'
  9.  
  10. });
trueblue
A co Ty robisz potem z title?
Krisu
  1. $(tabs_buttons).find('.tabs_container').append( title )
  2. $(items).find('.title').remove()
trueblue
Nie wiem co masz w tabs_buttons oraz w items.
Jednym zdaniem, jeśli dodajesz klasy do istniejących elementów (ew. usuwasz inne klasy z tych elementów), to robisz to na okrętkę.
Krisu
Jeżeli chcesz dokładnie wiedzieć do czego było mi to potrzebne napiszę na PW, ale w 100% mi pomogłeś i osiągnąłem zamierzony efekt. Po prostu nie znam się na JS, wolę pisać w PHP.
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.