cambiar estilo con el valor de un input

[chiquirf]

Hola a todos,

Necesito mostrar y ocultar capas dependiendo del valor de un input.

El valor del input "nbAdultos" lo cambio con otra funcion JavaScript (por eso está como readOnly) y ahí no tengo problema.

La idea es que haga lo siguiente:

Inicialmente la capa 1 está visible y el valor por defecto del input es "1" y todas las demás capas estan en "hidden", la idea es que se muestre la cantidad de capas dependiendo del valor del input siguiendo esta lógica:

si es "1" -> muestra NomAdul1, las demás ocultas.
si es "2" -> muestra NomAdul1 y NomAdul2, el resto ocultas.
si es "3" -> muestra NomAdul1, NomAdul2 y NomAdul3, el resto ocultas.
si es "4" -> muestra todas.

He intentado hacer esto, el navegador no me da error pero no hace nada.

¿que estoy haciendo mal????

Gracias de antemano por la ayuda

Saludos


AQUI VA LOS CODIGOS:

Código:

function showNames(){
	var Adultos;
	var numAdult = document.this;
	Adultos = numAdult.value;
	if (Adultos == 1) { 
                      document.capa1.style.visibility = "visible";
                }
	if (Adultos == 2) { 
                      document.NomAdul1.style.visibility = "visible";
                      document.NomAdul2.style.visibility = "visible";
                }
	if (Adultos == 3) { 
                      document.NomAdul1.style.visibility = "visible";
                      document.NomAdul2.style.visibility = "visible";
                      document.NomAdul3.style.visibility = "visible";
                }
	if (Adultos == 4) { 
                      document.NomAdul1.style.visibility = "visible";
                      document.NomAdul2.style.visibility = "visible";
                      document.NomAdul3.style.visibility = "visible";
                      document.NomAdul4.style.visibility = "visible";
                }

}

Código HTML:

<input id="nbAdultos" readonly="readOnly" size="1" value="1"  name="nbAdultos" onchange="showNames();" />


<div id="NomAdul1" style="visibility:visible;">Nombre 1</div>
<div id="NomAdul2" style="visibility:hidden;">Nombre 2</div>
<div id="NomAdul3" style="visibility:hidden;">Nombre 3</div>
<div id="NomAdul4" style="visibility:hidden;">Nombre 4</div> 

[David]

¿Ya intentaste colocando comillas?

Código:

if (Adultos == "1") {}

[derkenuke]

Hola:

Código PHP:

      var Adultos; 
    var numAdult = document.this; 
    Adultos = numAdult.value;  
   

¿Qué estas intentando hacer aqui? ¿Obtener el valor del campo nbAdultos? Será más correcto así:

Código PHP:

  function showNames(caja) { 
  var Adultos = caja.value;    // si quieres ponle un parseInt() para más seguridad 
  // ...  
   

y luego la llamada sería así:

Código HTML:

<input id="nbAdultos" onchange="showNames(this);" .... /> 

Saludos

[chiquirf]

Gracias por las respuesas, pero no me sale de ninguna de las 2 formas.

He probado tambien quitando el atributo ReadOnly al input y cambiando el valor a mano y nada.

He encontrado otro codigo que hace algo parecido pero pulsando enlaces, a ver si viendolo logro solucionar mi problema con el input, ya les contare como me fue.

Si alguien tene otra idea que me avise porfa.

Gracias

[chiquirf]

NADA DE NADA....

En ejemplo que les mencione era con el evento OnClick en un enlace, y en este caso estoy usando el evento OnChange y aquí está el problema, no me funciona este evento, ya que he metido un alert("Hola") dentro de la funcion y nada...

Este es el input que exactamente tengo en la web:

Código HTML:

<input type="text" class="nightsEntry" id="nbAdultos" readonly="readOnly" size="1" value="1"  name="nbAdultos"  onkeyup="showNames(nbAdultos)" onchange="showNames(nbAdultos)" /> 

Basandome en este ejemplo he puesto tambien la funcion OnKepUp quitado el ReadOnly y poniendo el ratón encima y nada.

Ojala que alguien me pueda ayudar.

Saludos

Carlos

[caricatos]

Hola:

Lo que pones dentro de una función, si se trata de una cadena debe estar entrecomillada... prueba así:

Código:

onchange="showNames('nbAdultos')"

Saludos