Actualmente estoy creando un sitio simple de edición de texto en línea. Y no puedo detectar que se presiona la tecla de retroceso. Aquí está el código: HTML
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="cssfile/style.css"> <title> Code Editor </title> <script src="jsfile/main.js"></script> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <div class="navdiv"></div> <div id="board" class="board"> </div> </body> </html>js: Este es mi código principal:
document.addEventListener("keypress", function (event) { console.log(event.key) if (event.key == "Enter") { document.getElementById("board").innerText += '\n' } else { document.getElementById("board").innerText += event.key } });Este es mi código y lo intenté.
if(event.key == "Backspace")Pero eso no funcionó.
Estás cerca.
Está utilizando la keypress de tecla cuando debería utilizar la keyup (o la keydown si desea saber antes de que se complete la pulsación de la tecla).
El evento KeyPress se invoca solo para teclas de caracteres (imprimibles), los eventos KeyUp y KeyDown se generan para todos, incluidos los no imprimibles, como Control, Shift, Alt, BackSpace, etc.
Prueba esto:
document.addEventListener("keyup", function(event) { console.log(event.key); if (event.key === "Backspace") { document.getElementById("board").innerText += '\n' } else { document.getElementById("board").innerText += event.key } });El evento de keypress de tecla ha quedado obsoleto y hay un cambio que su navegador no lo admite. Utilice keydown en su lugar.
document.addEventListener("keydown", function (event) { console.log(event.key) if (event.key == "Backspace") { document.getElementById("board").innerText += '\n' } else { document.getElementById("board").innerText += event.key } });El evento de keypress de tecla está en desuso y se activa solo cuando una pulsación de tecla produce un valor de carácter. Por lo tanto, no se activa con el retroceso en su caso.
Deberías usar el evento keydown .