ejemplos - jQuery-keydown() en div no funciona en Firefox
keypress() jquery (7)
Tengo el siguiente código de ejemplo, que debería mostrar una alerta cuando el div esté enfocado y se presione una tecla. Esto hace lo que espero en IE 7, pero no en Firefox 3.5.5. ¿Qué estoy haciendo mal?
<html>
<head>
<title>JS test</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#testdiv").keydown(function(event) {
alert("Pressed " + event.keyCode);
});
});
</script>
<style type="text/css">
#testdiv
{
width: 50;
height: 50;
background-color: red;
}
</style>
</head>
<body>
<div id="testdiv"></div>
</body>
</html>
EDITAR : Acabo de tratar de reemplazar keydown con keypress y keyup y esos tampoco funcionan. Por cierto, también me aseguré de que mi configuración de "Buscar mientras escribes" está desactivada por las dudas.
Puede consultar en línea desde aquí
Código fuente
<html>
<head>
<title>JS test</title>
<script type="text/javascript">
$(document).ready(function() {
$("#testdiv").keydown(function(event) {
alert("Pressed " + event.keyCode);
});
});
</script>
<style type="text/css">
#testdiv
{
width: 50px;
height: 50px;
background-color: red;
}
</style>
</head>
<body>
<div id="testdiv" tabindex="0"></div>
</body>
</html>
Conseguí lo anterior para trabajar en Firefox, así:
$(''#domainTableDiv'').keydown(function(e) {
alert(e.type + " button(" + e.which + ") ctrl(" + e.metaKey + ") alt(" + e.altKey + ") shift(" + e.shiftKey + ")" );
});
$(''#domainTableDiv'').focus();
Una vez que el DIV tiene el foco establecido explícitamente, los eventos clave se activan muy bien en Firefox 4.0.1
Es por la versión jQuery. prueba http://code.jquery.com/jquery-latest.js como fuente
Necesitas darle al div un tabindex para que pueda recibir el foco.
<div id="testdiv" tabindex="0"></div>
No espero que esto funcione, ya que un div no es algo que debería recibir eventos clave como ese. Si colocaste una <entrada> dentro de ese div, y el usuario presionó una tecla en la entrada misma, el evento burbujeará hasta el div y ejecutará tu función. No estoy 100% seguro de lo que está haciendo su proyecto, así que no sé cómo darle más consejos, pero a pesar de que no debería estarlo, estoy sorprendido de que IE esté ejecutando un evento clave en un div.
No pude obtener ninguna de estas respuestas para trabajar en Firefox 5 usando el CDN más reciente de jquery. Necesitaba saber si uno de los hijos del div tenía eventos clave, así que recurrí a esto:
$(document).keypress(function(e){
if(!$(e.target).parents().is("#testdiv")) return;
/* do child-of-div specific code here */
}
Si el objetivo es el div actual (y tiene foco), me imagino que podrías hacer algo como esto:
$(document).keypress(function(e){
if(!$(e.target).is("#testdiv")) return;
/* do div specific code here */
}
También podemos usar algo como esto:
$(''#tbl tbody'').attr("tabindex", 1).focus();
$(''#tbl tbody'').keydown(function (event) {
...
});