Ayuda por favor con caja de texto. No puedo obtener su valor.
Publicado por Alberto (7 intervenciones) el 29/01/2018 22:00:13
Buenas tardes, ando aprendiendo a programar en JS pero me he encontrado que no puedo extraer lo que está dentro de la caja de texto y el código, aparentemente está bien. No encuentro el error. ¿Alguien por favor, me brinda ayuda? Dejo el código acá:
-------------------------------------------------------------------------------------------------------------------------------------------------------
Código HTML
-------------------------------------------------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------------------------------------------
Acá dejo el código de JS:
-------------------------------------------------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------------------------------------------
Código HTML
-------------------------------------------------------------------------------------------------------------------------------------------------------
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Figuras con líneas rectas</title>
</head>
<body>
<h1>Diseño de figuras geométricas a partir de líneas rectas</h1>
<p>¿Cuántas líneas quieres?<br>Esperamos la respuesta:
<input type="text" id="Caja_texto" />
<input type="button" value="here we go" id="Boton" />
</p>
<canvas width="500" height="500" id="Plano2d"></canvas>
<p><strong>Dibujo final</strong></p>
<script src="lineasrectascurvas.js"></script>
</body>
</html>
Acá dejo el código de JS:
-------------------------------------------------------------------------------------------------------------------------------------------------------
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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
var texto = document.getElementById("Caja_texto").value;
var Bot = document.getElementById("Boton");
Bot.addEventListener("click", acc); // para que el evento suceda, tenemos que agregar una función llamada addEventListener(evento, parametros a los que el evento va a reaccionar);
//------------------------------------------------------------------------------------------------------------------------------------------------------
Funcion que toma el valor y me lo muestra
//------------------------------------------------------------------------------------------------------------------------------------------------------
function acc()
{var salidatexto = texto.value;
alert(salidatexto);
}//---------------------------------------------------------------------------------------------------------------------------
// cosas del dibujo
//---------------------------------------------------------------------------------------------------------------------------
var ID = document.getElementById("Plano2d");
var plano = ID.getContext("2d");
function dibujando(xi, yi, xf, yf, color)
{plano.beginPath();
plano.strokeStyle = color;
plano.moveTo(xi, yi);
plano.lineTo(xf, yf);
plano.stroke();
plano.closePath();
}for (i = 0; i < 25; i++) {
// dibujo en si
dibujando(250, (i*10), (10*(26+i)), 250, "black");
dibujando(250, (i*10), (10*(24-i)), 250, "black");
dibujando(250, (10*(50-i)), (10*(24-i)), 250, "black");
dibujando(250, (10*(50-i)), (10*(26+i)), 250, "black");
//dibujando esquina derecha
dibujando(500, (10*(24-i)), (10*(50-i)), 0, "black");
dibujando(0, (10*(24-i)), (10*i), 0, "black");
dibujando(0, (10*(26+i)), (10*i), 500, "black");
dibujando((10*(26+i)), 500, 500, (10*(50-i)), "black");
}dibujando(250, 0, 250, 500, "black");
dibujando(0, 250, 500, 250, "black");// lineas centrales del plano
//dibujando(0, 0, 0, 500, "black"); //contorno
//dibujando(0, 500, 500, 500, "black");
//dibujando(500, 500, 500, 0, "black");
//dibujando(500, 0, 0, 0, "black");Valora esta pregunta
0
