Tengo un marcado, así ...

<div id="items">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>

Quiero escribir algunas funciones para afectar cada una usando jQuery. Algo como...

$(".item").click(function(i){
    i.hide();
});

¿Alguien puede darme una breve explicación de cómo hacer que esto funcione? ¿Debo usar .each ()?

1
fancy 5 jul. 2011 a las 11:15

7 respuestas

La mejor respuesta

Funciona también sin cada uno

$(".item").click(function() {
   $(this).hide();
});
1
Sufendy 5 jul. 2011 a las 07:24

Sí, puedes usar cada uno, así:

$(".item").each(function(){
   //Here, use $(this) to reference current element 
   $(this).hide();
});

.each() aplica la función que pasa a cada elemento en el selector coincidente, haciendo referencia a this el elemento actual.

Tiene parámetros opcionales y otras cosas. Aquí puede obtener más información: http://api.jquery.com/jQuery.each/

Espero que esto ayude. Salud

0
Edgar Villegas Alvarado 5 jul. 2011 a las 07:21

Puedes hacerlo :)

$(".item").live('click',function(){
    $(this).hide();
});
2
Carls Jr. 5 jul. 2011 a las 07:21

(a) La documentación es clara sobre lo que hacen los controladores de eventos.

(b) Como la mayoría de los métodos jquery (y todas las excepciones establecen específicamente que son excepciones), .click se aplicará a cada miembro del conjunto seleccionado por el objeto jquery. Entonces, no, no necesita usar .each si desea que cada uno de ellos tenga la misma función instalada que el controlador de eventos.

(c) this o event.currentTarget (o en su ejemplo, i.currentTarget) es la forma de acceder al nodo dom que es el destinatario del evento. i en su ejemplo será el objeto del evento.

2
Marcin 5 jul. 2011 a las 07:21
$('.item').each(function(index){
    $(this).bind('click', function(){
        $(this).hide();
        //alert("hiding item nr: "+index);
    });
});
0
helle 5 jul. 2011 a las 07:20

Desea usar $(this) en lugar de i dentro de la función del controlador. El argumento para el controlador es un objeto de evento, que contiene información sobre el evento (como las coordenadas del mouse donde se hizo clic, y otras cosas). Probablemente en algún lugar de i se encuentre el objeto en el que se hizo clic, pero puede acceder a "cualquier objeto en el que se hizo clic" con mucha más facilidad utilizando this.

No tiene que usar each porque jQuery vincula automáticamente el controlador a cada uno de los elementos que coinciden con la consulta ".item".

$(".item").click(function(i){
    $(this).hide();
});

Editar : se agregó $(...) alrededor de this, como se indica en la documentación. (Por alguna razón, funcionó para mí sin el $, pero aparentemente lo necesitas).

-1
mgiuca 5 jul. 2011 a las 07:37

Esto con suerte hace lo que quieres. Háganos saber si eso funciona, espero que ayude.

$(".item").each(function(){
     $(this).click(function () {
         $(this).hide();
     });
});
0
Benny Tjia 5 jul. 2011 a las 07:23