Controlar comportamiento del navegador - Combinaciones de teclas
Una forma de controlar el comportamiento del navegador cuando se presionen las teclas Ctrl + S
y/o Ctrl + U
es evaluando previamente si el usuario ha presionado la tecla Ctrl
como se muestra a continuación:
if ( e.ctrlKey ) {
// Si el usuario ha presionado la tecla Ctrl
// las instrucciones acá serán ejecutadas, como
// por ejemplo:
e.preventDefault();
}
Ten en cuenta que puede utilizar preventDefault()
con stopPropagation()
para evitar el comportamiento por defecto del navegador. Vamos a colocar un ejemplo práctico de dicho comportamiento:
onkeydown = e => {
let tecla = e.which || e.keyCode;
// Evaluar si se ha presionado la tecla Ctrl:
if ( e.ctrlKey ) {
// Evitar el comportamiento por defecto del nevagador:
e.preventDefault();
e.stopPropagation();
// Mostrar el resultado de la combinación de las teclas:
if ( tecla === 85 )
console.log("Ha presionado las teclas Ctrl + U");
if ( tecla === 83 )
console.log("Ha presionado las teclas Ctrl + S");
}
}
Presione las teclas `Ctrl+U`y luego `Ctrl+S` una vez hayas presionado el botón «Ejecutar» y observe el resultado en la consola.
Si bien, se muestra un mensaje indicando que se han presionado las teclas Ctrl + U
y Ctrl + S
, a la vez, se evita que el navegador muestre el código fuente de la página o se guarde cuando el usuario realice cualquiera de las dos (02) combinaciones. Sin embargo, eso no evita que, utilizando otros métodos puedan acceder a dicho código, como por ejemplo, si se descarga la página de la siguiente forma:
wget -r https://ejemplo.com/
En el ejemplo anterior el comando wget -r
descarga una página de forma recursiva. Es decir, se descarga el código HTML, JavaScript, CSS, imágenes, etc. Por lo tanto, no es posible evitar que el quiera ver el código fuente acceda a él.
Uso práctico
Normalmente, cuando se bloquea algún comportamiento por defecto del navegador se hace con la intención de utilizarse para realizar acciones que requieran dichas combinaciones de teclas.
Un posible uso práctico de la combinación de las teclas Ctrl + S
es hacer que nuestra aplicación guarde registros en una base de datos en lugar de guardar la página en nuestro computador, que es la acción por defecto del navegador.