Problema al cambiar de color un input

JaviCN · 01/06/2012, 12:34

Hola a todos estoy liado con un formulario en el que al validar los datos si estos no son correctos haga que los cuadros de texto de este cambien de color y para probarlo hice una pequeña prueba para luego hacerlo mas grande y ahora viene el problema, en el único navegador que me sale es en chrome y solo menos de un segundo, el color solo llega a verse un parpadeo.

El código es este:
index.html

Código:

<html>
<head>
<title>Prueba</title>
    <script type="text/javascript">
        function prueba()
        {
            var ina=document.getElementById('a').value;
          
            if(ina=='a')
            {
               a.style.backgroundColor = 999999;
            }
        }
        
    </script>
</head>
<body>
<form action="index.html" method="post" onSubmit="prueba();">
    <input type="text" id="a">
    <input type="submit" value="Enviar">

</form>
</body>

</html>

Lo que intento hacer es que si escribes una a se cambie de color, cosa que hace solo un parpadeo ¿por que me hace eso?

Un saludo

IsaBelM · 01/06/2012, 14:14

se está enviando el formulario. prueba ahora

Cita:

a.style.backgroundColor = 999999;
return false;

onsubmit="return prueba();">

JaviCN · 01/06/2012, 14:36

Era eso muchisisimas gracias por la ayuda

JaviCN · 02/06/2012, 05:15

acabo de verle un fallo, si llamas a una función que lo hace en otra función vuelve a pasar
pongo el código y sabréis a lo que me refiero

Código:

function experimento()
{
var ina=document.getElementById('a').value;
    var inb=document.getElementById('b').value;
    if(ina=='a')
    {
        a.style.backgroundColor = 999999;
        return false;
       
    }
}
function prueba()
{
    experimento();
}

La cosa de hacerlo con una función que llame a otra función es para poder validar un formulario que valida cada campo con una función

IsaBelM · 02/06/2012, 08:57

no me había fijado en esta línea

Cita:

a.style.backgroundColor = 999999;

aquí tienes dos errores

un elemento se puede referenciar por su id o name por que son de ámbito global. pero no todos los navegadores lo admiten. lo correcto es usar el estandar document.getElementById()
el color que le asignas es hexadecimal y de nuevo el estandar dice que ha de ir precedido por (#) y entrecomillado

Cita:

Iniciado por JaviCN

La cosa de hacerlo con una función que llame a otra función es para poder validar un formulario que valida cada campo con una función

no veo la razón, pero bueno. añade esto

Cita:

return experimento();

JaviCN · 02/06/2012, 09:33

Por ahora funciona en el pequeño, probare en el grande, pero es casi seguro que funcionara.

Muchísimas gracias de nuevo

JaviCN · 02/06/2012, 13:42

El problema se soluciona si pongo una sola función con el return, pero sigue al llamar a mas de 2 funciones, me explico

si pongo esto:

Código:

return experimento();
return experimento2();

solo ejecuta experimento()
y si pongo esto:

Código:

return experimento()+experimento2();

me ejecuta las 2 pero pasa como antes, que solo esta un parpadeo

IsaBelM · 03/06/2012, 07:27

al usar mas de una función, a estas has de añadirle return true si no cumple con la condición. por otro lado el operador que has de usar es (&)

JaviCN · 03/06/2012, 08:07

Cita:

Iniciado por IsaBelM

al usar mas de una función, a estas has de añadirle return true si no cumple con la condición. por otro lado el operador que has de usar es (&)

Te refieres a

Código:

return experimento() & experimento2();

si es asi no funciona

IsaBelM · 03/06/2012, 14:13

y has usado else??

JaviCN · 03/06/2012, 14:30

un else donde?

IsaBelM · 03/06/2012, 14:41

como que donde?? si no se cumple la condición tendrás que devolver true

Cita:

if(concidion) return false;
else return true;

JaviCN · 03/06/2012, 14:43

Cita:

Iniciado por IsaBelM

como que donde?? si no se cumple la condición tendrás que devolver true

acabo de liarme bastante, que tiene que ver eso con la llamada en cadena de 2 funciones?

IsaBelM · 03/06/2012, 15:21

de lo que te estoy hablando es algo básico

JaviCN · 03/06/2012, 16:27

Un if se usarlo pero lo que no entiendo como podría usarlo para que 2 funciones se ejecuten correctamente

Código:

function experimento()
{
	var ina=document.getElementById('a').value;
    
    if(ina=='a')
   {
        a.style.backgroundColor = '#999999';
		
        return true;
       
    }
    else
    {
        return false;
    }
}
function experimento2()
{
	var inb=document.getElementById('b').value;
    if(inb=='a')
    {
	b.style.backgroundColor = '#999999';
	return true;
    }
    else
    {
        return false;
    }
}
function prueba()
{
    return experimento() + experimento2();
}

en prueba() me refiero

IsaBelM · 03/06/2012, 16:34

quiero pensar que estás algo desbordado al no lograr lo que pretendes, puesto que ya te he explicado lo que has de hacer en varias ocasiones. pero como si escucharas llover

Cita:

JaviCN · 03/06/2012, 16:57

no lo entendí bien de un principio por que creo que me pasa como tu dices, que estoy desbordado al no conseguir una cosa tan sencilla, pero la cosa es que aun con el código que me pusiste sigue pasando lo mismo que al principio, es decir, que el color del input sigue durando el tiempo de un parpadeo y debería de mantenerse

IsaBelM · 03/06/2012, 17:22

algo de culpa tengo yo. pero ya estoy algo cruzada con este tema

Cita:

JaviCN · 03/06/2012, 17:34

No pasa nada la culpa la tengo yo por que soy un cansino y mi agobio tiene la culpa de todo, el código va a trozos es decir, ahora solo funciona 1 solo, solo funcionan los 2 si haces que se coloreen uno a uno

IsaBelM · 03/06/2012, 18:06

Cita:

JaviCN · 03/06/2012, 18:10

Ahora se quedan pero solo se colorean si haces que se coloreen los 2 al mismo tiempo

IsaBelM · 04/06/2012, 05:38

fue un pequeñisimo error que dejé propósito para comprobar si eres de los que esperan a que le den un código, y si funciona como quiere

si no funciona como quiere, no se plantea estudiarlo e intentar modificalrlo para adaptarlo a sus necesidades

mi teoría ha sido ratificada

aunque ya lo sospechaba

JaviCN · 04/06/2012, 06:49

Cita:

Iniciado por IsaBelM

fue un pequeñisimo error que dejé propósito para comprobar si eres de los que esperan a que le den un código, y si funciona como quiere

si no funciona como quiere, no se plantea estudiarlo e intentar modificalrlo para adaptarlo a sus necesidades

mi teoría ha sido ratificada

aunque ya lo sospechaba

intentar lo intente pero no mucho la verdad, en javascript ando muy pegado

JaviCN · 04/06/2012, 06:55

Cita:

Iniciado por JaviCN

intentar lo intente pero no mucho la verdad, en javascript ando muy pegado

Ya di con el estoy cuajado

Código:

function experimento()
{
    var ina=document.getElementById('a').value;

    if(ina=='a')
    {
        document.getElementById('a').style.backgroundColor = '#999999';


        return false;
    }
    else
    {
        document.getElementById('a').style.backgroundColor = '#fff';
        return true;
    }
}
function experimento2()
{
    var inb=document.getElementById('b').value;
    if(inb=='a')
    {
        document.getElementById('b').style.backgroundColor = '#999999';
        return false;
    }
    else
    {
        document.getElementById('b').style.backgroundColor = '#fff';
        return true;
    }
}
function prueba()
{
    var retornar1 = experimento();
    var retornar2 = experimento2();
    return retornar1 && retornar2;

}