2010-10-14 22 views
32

Przeszukałem dokumentację i spędziłem trochę czasu w sieci, ale nie mogę znaleźć rozwiązania! Chcę, aby alert informował mnie, która iteracja każdego() była włączona po kliknięciu przycisku .thumb.Jquery each() Counter

EG: Jest sześć. Nie klikaję na numer 3, przeglądarka wyświetla 3!

To, co się dzieje, niezależnie od tego, który kliknięcie jest kliknięte, powoduje wyświetlenie 6 znaków.

var counter = 1; 
$('.thumb').each(function() { 
    $(this).click(function() { 
     alert (counter); 
    }); 
    counter++; 
}); 

Każda pomoc jest wdzięcznie przyjmowana.

Odpowiedz

59

To dlatego, że jesteś dzielenie tej samej zmiennej counter dla wszystkieclick ładowarki i to bez względu na to kończy się na końcu pętli. Zamiast tego należy użyć jednego przekazany do pętli (parametr indeks .each() że już tam jest), na przykład:

$('.thumb').each(function (i) { 
    $(this).click(function() { 
     alert (i+1); //index starts with 0, so add 1 if you want 1 first 
    }); 
}); 

You can test it here.

0

Wywołanie function() jest anonimową deklaracją funkcji. Musisz zrozumieć, jak działają funkcje LISP (tak, ecmascript to seplenienie).

Zamiast $ ('') kciukiem każda, należy użyć coś jak (niesprawdzone).

var list = $('.thumb'); 
for(var i=0; i<list.length; i++) { 
    $(list[i]).click(function(){ 
     alert(i); 
    }); 
} 
+1

To nie rozwiązuje problemu, jest o wiele mniej wydajne, ale ten sam problem z dzieloną zmienną, wszyscy będą ostrzegać, co to jest "i" na końcu pętli. –

+0

@Nick ma rację. Dałoby to taki sam wynik jak w pytaniu. – user113716

+0

OK, mój zły. Nie powinienem publikować tego bez testowania. –

0

stosować roztwór jak @Paulo zasugerował, że trzeba to zrobić tak:

var list = $('.thumb'); 

for(var i=0; i<list.length; i++) { 
    (function(i_local) { 
     list.eq(i).click(function(){ 
      alert(i_local); 
     }); 
    })(i + 1); 
}​ 

... chociaż miałbym use @Nicks .each() solution instead. Znacznie czystsze.

Powiązane problemy