ejemplos - eventos en javascript pdf
Evento de enlace/retroceso de enlace Javascript (1)
Los eventos clave solo se activan en el documento y los elementos que pueden recibir atención. Por lo tanto, para manejar eventos clave en un elemento <canvas> , debe permitir que reciba el enfoque agregando un atributo de tabindex (por ejemplo, <canvas id="game" width="800" height="400" tabindex="1"></canvas> ) o simplemente administrando eventos clave para todo el documento, que puede no ser lo que desea (por ejemplo, si tiene más de un elemento en la página para la que desea manejar eventos clave).
En cuanto a cómo adjuntar los controladores de eventos, la forma más sencilla es la siguiente:
var el = document.getElementById("your_element_id");
el.onkeydown = function(evt) {
evt = evt || window.event;
alert("keydown: " + evt.keyCode);
};
el.onkeyup = function(evt) {
evt = evt || window.event;
alert("keyup: " + evt.keyCode);
};
Si puede necesitar varios escuchas, puede usar addEventListener en la mayoría de los navegadores o attachEvent en IE <= 8:
if (typeof el.addEventListener != "undefined") {
el.addEventListener("keydown", function(evt) {
alert("keydown: " + evt.keyCode);
}, false);
} else if (typeof el.attachEvent != "undefined") {
el.attachEvent("onkeydown", function(evt) {
alert("keydown: " + evt.keyCode);
});
}
¿Cómo puedo vincular una función a los eventos clave arriba / abajo?
Puede vincularse a todo el documento o un solo elemento, o bien funcionará en este caso.
Esto tiene que ser sin ninguna biblioteca de JavaScript. Sólo me preocupa principalmente la última versión de Firefox. Particularmente el elemento lienzo.
He intentado esto: (FF 3.6.9 Windows 7)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test</title>
</head>
<body>
<div class="wrapper">
<canvas id="game" width="800" height="400">
</canvas>
</div>
<script type="text/javascript">
var el = document.getElementById("game");
el.onkeydown = function(evt) {
evt = evt || window.event;
alert("keydown: " + evt.keyCode);
};
el.onkeyup = function(evt) {
evt = evt || window.event;
alert("keyup: " + evt.keyCode);
};
</script>
</body>
</html>