estoy realizando solicitando del usuario un número que determinará el espacio entre las lineas del dibujo, para que se ejecute la función que realiza el dibujo, el usuario debe dar click en el botón "enviar", para detectar este evento utilizo la función addEventListener de la siguiente forma: boton.addEventlistener("click", dibujoporClick) sin emabrgo esto no resulta cuando el usuario hace click sobre el botón. ¿alguien sabe qué pasa?. En al consola me sale que boton.addEventlistener is not a function
var ensayo = document.getElementById("dibujo");
var lienzo = ensayo.getContext("2d");
var texto = document.getElementById("txt_lineas");
var boton = document.getElementById("botoncito");
var ancho = ensayo.width;
boton.addEventlistener("click", dibujoporClick);
function dibujoporClick()
{
var lineas = parseInt(texto.value);
var l = 0;
var xi; yi; xf; yf;
var espacio = ancho/lineas
function dibujoCuadro(color, xi,yi,xf,yf)
{
lienzo.beginPath();
lienzo.strokeStyle = color;
lienzo.moveTo(xi, yi);
lienzo.lineTo(xf,yf);
lienzo.stroke();
lienzo.closePath();
}
while (l<lineas)
{
yi= l*espacio;
xf= (l+1)*espacio;
dibujoCuadro("pink", 0,yi,xf,300);
yi= l*espacio;
xf= 300-((l+1)*espacio)
dibujoCuadro("pink", 300,yi,xf,300);
xi= l*espacio
yf= (l+1)*espacio
dibujoCuadro("pink", xi,0,300,yf);
xi= 300- (l*espacio)
yf= l*espacio
dibujoCuadro("pink", xi,0,0,yf);
l=l+1;
}
}
<body>
<h1>Ensayo de dibujo</h1>
<input type="text" id="txt_lineas" />
<input type="button" value="enviar" id="botoncito" /> <br> <br>
<canvas id="dibujo" width="300px" height="300px"></canvas>
<p>Así queda tu dibujo</p>
<script type="text/javascript" src="dibujoparaborrar.js">
</script>
</body>
dibujoparaborrar.js
tienes que incluirlo antes, preferiblemente en la etiquetahead
. Veo que lo estás incluyendo después de los elementos.addEventListener
, pusistelistener
, con ele minúscula. Revida el error en la consola, te indica que no es una función.<head>
, sin atributodefer
por ejemplo trataría de añadir en escuchador de evento a un elemento que aun no existe y ahí tendría un error.