Estoy tratando de hacer una ventana emergente de alerta cuando presiono una secuencia de teclas en mi sitio web, por ejemplo, si escribo "420" en mi teclado, quiero que aparezca un mensaje emergente que diga "Lo lograste" o algo así. Lo obtengo cuando uso solo 2 pulsaciones de teclas usando esto:
if (e.ctrlKey && e.keyCode == 90) { alert("Sweet"); } });Que es la tecla CTRL + letra Z, pero parece que no puedo entender cómo hacer que funcione si quiero que sea la secuencia correcta de 4 2 0 o algo similar. Y solo puedo usar JavaScript.
Para que eso funcione, debe realizar un seguimiento de las teclas presionadas.
Aquí, agrego cada tecla presionada a una variable str al final de esa variable, y luego corto todo excepto los últimos 3 caracteres.
let str = ''; window.addEventListener('keyup', function(event) { str = `${str}${event.key}`.substr(-3); if (str === '420') console.log('You made it!'); })Teclas simultáneas (como ctrl+Z) es diferente a una secuencia (como 420).
Una de las muchas estrategias podría ser dividir la secuencia en una matriz y usar una copia de ella ( temp ) para cambiar esa secuencia cuando se escribe el primer elemento.
let targetSequence = "420".split("") let temp = [...targetSequence] document.querySelector("#test").addEventListener("keyup", function(e) { if (temp[0] == e.key) { temp.shift() } else { temp = [...targetSequence] } console.log(temp) // If the sequence was done if (!temp.length) { console.log("--- You did it! ---") temp = [...targetSequence] } }) <input id="test">