Foros del Web » Programando para Internet » Jquery »

Tratar inputs individualmente (jQuery)

Estas en el tema de Tratar inputs individualmente (jQuery) en el foro de Jquery en Foros del Web. Hola, de nuevo por estos lares que siempre me sacan la pata del barro, de verdad que no sabía qué título ponerle al tema pero ...
  #1 (permalink)  
Antiguo 03/03/2010, 12:33
Avatar de Jesusowins  
Fecha de Ingreso: enero-2008
Mensajes: 71
Antigüedad: 16 años, 3 meses
Puntos: 0
Tratar inputs individualmente (jQuery)

Hola, de nuevo por estos lares que siempre me sacan la pata del barro, de verdad que no sabía qué título ponerle al tema pero espero que me ayuden. Estoy un poco liado con esto.

Tengo 3 inputs que quiero colorear dependiendo de su atributo 'alt':

Código HTML:
<script src="jquery.js"></script>

<input type="text" alt="green" value="Verde"><br>
<input type="text" alt="red" value="Rojo"><br>
<input type="text" alt="blue" value="Azul"><br>
<input id="colorear" type="button" value="Colorear!">

<script>
$("#colorear").click(function(){
	$("input[type=text]").css("background-color", $("input[type=text]").attr("alt"));
	});
</script> 
Resultado indeseado: Los 3 campos de texto se pintan de VERDE!! o sea, toma el valor 'alt' del primer input solamente.

Alguien conoce algún método para que que cada input "trabaje" independientemente pero dentro de una misma función "sencilla". Lo que no quisiera es recurrir a los IDs y darle uno a cada input... sería una lala.

Les agradezco muchachos. Gracias.
__________________
JesusAcosta
  #2 (permalink)  
Antiguo 03/03/2010, 12:54
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años, 2 meses
Puntos: 101
Respuesta: Tratar inputs individualmente (jQuery)

Se hace confuso. Usa $(this) para referirte al input que clickeas:

Cita:
$("#colorear").click(function(){
$("input[type=text]").css("background-color", $(this).attr("alt"));
});
Por que si usas $("input[type=text]") estas obteniendo un array.
  #3 (permalink)  
Antiguo 03/03/2010, 12:54
Avatar de juaniquillo
Colaborador
 
Fecha de Ingreso: noviembre-2005
Ubicación: San Juan, Puerto Rico
Mensajes: 5.745
Antigüedad: 18 años, 6 meses
Puntos: 281
Respuesta: Tratar inputs individualmente (jQuery)

tienes varios input así que tienes que hacer un each():

Código javascript:
Ver original
  1. $(document).ready(function(){
  2.     $("#colorear").click(function(){
  3.         $("input[type=text]").each(function(){
  4.             var color = $(this).attr("alt");
  5.             $(this).css("background-color", color);
  6.         });
  7.         return false;
  8.     });
  9. })


*Edito Me ganaste mayid. Tu método es más conciso
__________________
Por fin.. tengo algo parecido a un blog
Y por lo visto ya estoy escribiendo...
  #4 (permalink)  
Antiguo 03/03/2010, 13:05
Avatar de Jesusowins  
Fecha de Ingreso: enero-2008
Mensajes: 71
Antigüedad: 16 años, 3 meses
Puntos: 0
Respuesta: Tratar inputs individualmente (jQuery)

Yeah!! Funca de maravilla juaniquillo! Aunque el de mayid no lo probé, agradezco la ayuda a los dos! :D
__________________
JesusAcosta

Etiquetas: input
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:41.