¿Por qué el retorno falso en la devolución de llamada por clave no detiene el evento de clic de botón?

Question

Tengo un botón y la siguiente rutina de javascript.

$("button").keydown(function(key) { 
    switch(key.keyCode) { 
    case 32: //space 
    return false; 
    } 
}); 

como lo entendía, la return false; sería detener la pulsación de tecla de ser procesada. Por lo tanto, no se llamará a $("button").click();. Para otros KeyCodes esto funciona como se esperaba. Por ejemplo, si intercepto 40, que es el botón de abajo, la página no se desplaza.

me di cuenta de este comportamiento en Firefox.

¿Por qué la return false; no se detiene el evento de clic de botón en el espacio? ¿Qué dice la especificación javascript sobre esto?

Answer 1

Esperamos haber respondido a su pregunta:

<input type="button" value="Press" onkeydown="doOtherStuff(); return false;"> 

return false; cancela con éxito un evento en todos los navegadores si se llama al final de un atributo del controlador de eventos en el HTML. Este comportamiento no está especificado formalmente en ningún lugar, hasta donde yo sé.

Si en lugar de configurar un evento a través de una propiedad de controlador de eventos en el elemento DOM (por ejemplo button.onkeydown = function(evt) {...}) o el uso de addEventListener/attachEvent (por ejemplo button.addEventListener("keydown", function(evt) {...}, false)) a continuación, sólo volver false de esa función no funciona en todos los navegadores y hay que hacer returnValue y preventDefault() cosas de mi otra respuesta. preventDefault se especifica en el DOM 2 spec el cual es implementado por la mayoría de los navegadores modernos convencionales. returnValue es específico de IE.

Answer 2

En primer lugar, si usted está detectando un carácter imprimible, tales como el espacio, que sería mejor con el evento keypress. En segundo lugar, la manera de prevenir la acción predeterminada es llamar preventDefault() en el caso de los navegadores no-IE y establezca la propiedad del evento returnValue-false en IE.

var button = document.getElementById("button"); 
button.onkeypress = function(evt) { 
    evt = evt || window.event; 
    var charCode = evt.keyCode || evt.which; 
    if (charCode == 32) { 
     if (evt.preventDefault) { 
      evt.preventDefault(); 
     } else { 
      evt.returnValue = false; 
     } 
    } 
}; 

No soy un experto en jQuery y supongo que se encarga de obtener el evento para usted:

$("button").keypress(function(evt) { 
    var charCode = evt.keyCode || evt.which; 
    if (charCode == 32) { 
     if (evt.preventDefault) { 
      evt.preventDefault(); 
     } else { 
      evt.returnValue = false; 
     } 
    } 
});