Come posso applicare una funzione a più immagini in jQuery?

Question

Ho bisogno di un piccolo aiuto con (probabilmente) una cosa molto semplice.

voglio usare uno script che converte le immagini da colore a scala di grigi. Ho ottenuto che funziona parzialmente -. La prima immagine diventa grigia, ma il secondo non sarà

So che questo è perché un id non può essere utilizzato più volte:

var imgObj = document.getElementById('grayimage');

Ho provato questo:

var imgObj = $(’.grayimage’)[0];

Ma non ha funzionato. Cambiare a getElementByClass anche non funziona. (Prima che la gente chiede, ho fatto cambiare la id alla classe nel tag <img>.)

ho davvero potuto usare un po 'di aiuto qui. Grazie in anticipo!

Answer 1

$('.grayimage').each(function(idx,imgObj){
    <do your code here>
});

Answer 2

$ ( 'grayimage') fornisce un elenco di tutti gli elementi con grayimage come classe. Se si aggiunge '[0]' si sta accedendo il primo elemento, in modo che qualsiasi modifiche apportate verranno applicate solo alla prima immagine che trova con questa classe.

Si dovrebbe scorrere tutti gli elementi:

var images = $('.grayimage');
for(i = 0; i < images.length; i++) {
   var image = images[i];

   // Do stuff
}