JavaScript - Problemas con "document.getElementById("variable");"

   
Vista:

Problemas con "document.getElementById("variable");"

Publicado por Antonio (7 intervenciones) el 21/10/2014 18:52:20
Buenas tardes, tengo el siguiente problema que no logro solucionar, pongo en situación:

Tengo un documento html con el siguiente codigo
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Documento sin t&iacute;tulo</title>
<script type="text/javascript" src="/cursojs/js/prueba.js"> >
</script>
</head>
<body>
<FORM name="input" action="/cursojs/js/prueba.js" method="get" >
<input type="text" size="5" maxlength="1" name="variable" />
<input type="submit" value="Enviar" onclick="opcion()" />
</FORM>
</body>
</html>

y quiero pasar desde el cuadro de texto una variable que la recoja y la mande al documento js, la cual tiene el siguiente código:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
function opcion() {
 
   var numero = document.getElementById("variable");
 
	switch (numero) {
 
	case 1:
document.write('<table border=\"1\">');
	document.write ('<tr>');
	var num = 7;
 
	for (var i = 0; i <=10 ; i++){
		document.write ('<td>');
			if ( i % 2 == 0 ){
 
				document.write('<font color=\"red\">');
				document.write( num + ' x ' + i + ' = ');
				document.write( num * i );
				document.write('</font>');
			}
 
			else {
				document.write('<font color=\"blue\">');
				document.write( num + ' x ' + i + ' = ');
				document.write( num * i );
				document.write('</font>');
			}
		document.write ('</td>');
	}
	document.write ('</tr>');
document.write("</table> </br> </br>");
 
 	break;
 
}

Como se puede observar, la variable que se le pase ejecutará un switch con diversas opciones, pero lo he probado incluso con una salida "document.write" y siempre aparece que el valor de la variable es "null", ruego que atiendan mi duda, gracias.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Problemas con "document.getElementById("variable");"

Publicado por xve (1595 intervenciones) el 21/10/2014 19:23:28
Hola Antonio, entiendo que te falta asignar el id al input...

Prueba a modificar esta linea:
1
<input type="text" size="5" maxlength="1" name="variable" id="variable" />

Coméntanos, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Problemas con "document.getElementById("variable");"

Publicado por Antonio (7 intervenciones) el 21/10/2014 19:56:34
Primero de todo, muchas gracias por comentar y ayudar.

Probé a ponerle el id tal como me sugieres.

<input type="text" size="5" maxlength="1" name="variable" id="variable" />

Ahora al ejecutar el botón de submit, de salida me lanza lo siguiente:

141021075446116181

El código pero puesto en el navegador...
Nótese que sin embargo en la URL pone variable=1 y en el fallo de consola, creo que nada relacionado con el fallo que yo tengo.

Muchas gracias.

P.D.: Es más, si mal no lo digo, creo que toma el valor del nombre del input y no del id que hemos puesto posteriormente.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve

Problemas con "document.getElementById("variable");"

Publicado por xve (1595 intervenciones) el 21/10/2014 20:32:02
Hola Antonio, entiendo que simplemente por añadir el id no te abra aparecido este mensaje... estoy seguro que antes ya te aparecía. Puede ser que haya algún acento, eñe o algún carácter que no interprete directamente desde el js, pero cuando lo ejecuta desde la pagina web, coge el content-type de la pagina, y no creo que tengas este problema.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Problemas con "document.getElementById("variable");"

Publicado por Antonio (7 intervenciones) el 21/10/2014 20:57:04
Vamos a ver, para verlo más claro lo he simplificado el código en otros dos archivos en el que he hecho un pequeño switch:

prueba2.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Documento sin t&iacute;tulo</title>
<script type="text/javascript" src="/cursojs/js/prueba2.js">
</script>
</head>
 
<body>
 
<font color="red"> Seleccione una de las siguientes opciones: </font> </br> </br>
 
 
<FORM name="input" action="/cursojs/js/prueba2.js" method="get" >
<input type="text" size="5" maxlength="1" name="variable"  />
<input type="submit" value="Enviar" onclick="opcion()" />
</FORM>
 
</body>
</html>

y prueba2.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
// JavaScript Document
 
function opcion(){
 
   var numero = document.getElementById("variable");
   //Con este document.write se ve el valor de la variable:
   document.write(numero);
 
	//switch sencillo para prueba
	switch (numero) {
 
	case 1:
	document.write("hola mundo");
	default:
	document.write("Esto no va");
 
 	break;
	}
}

Esta es la entrada:

mini_141021085529497022

y esta la salida:

mini_141021085603498879

En la salida se puede ver null, que es valor que toma la variable en lugar del "1" que hemos introducido por la entrada y el valor por defecto del switch que es "Esto no va"

Muchas gracias.

P.D.:
Esto es lo que me da cuando meto la recomendación que me has dado al principio:

<input type="text" size="5" maxlength="1" name="variable" id="variable" />

mini_141021085957114501
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Problemas con "document.getElementById("variable");"

Publicado por Antonio (7 intervenciones) el 21/10/2014 22:40:49
Por favor, ¿alguna sugerencia? Gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Problemas con "document.getElementById("variable");"

Publicado por Antonio (7 intervenciones) el 22/10/2014 02:03:36
¡Conseguido! Tras varias horas dándole vueltas:
Aparte de darle nombre al id="variable"

En el archivo js había que ponerle algo tan simple como un .value al document.getElementById, quedando tal que así:
1
var numero = document.getElementById("variable").value;

Pffff, la madre que lo parió...

Hasta pronto y gracias.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar