Tengo un div que se usa como entrada del usuario:
<div id="chat-message-input" contenteditable="plaintext-only">
Cuando el usuario presiona la tecla Intro (y no mantiene presionada la tecla Mayús), se envía el texto del usuario.
<script> document.querySelector('#chat-message-input').onkeyup = function(e) { // User hits enter key and is not holding shift if (e.keyCode === 13 && event.shiftKey != 1) { //Click submit button document.querySelector('#chat-message-submit').click(); // Clear input field document.getElementById('chat-message-input').innerHTML=''; }; </script>Problema: hay un breve momento en el que el div crea una nueva línea porque se presionó la tecla Intro, antes de que se borre el contenido del div.
Solo quiero que se cree una nueva línea en estas circunstancias:
¿Alguien sabe cómo puedo evitar que se cree una nueva línea dados los requisitos anteriores?
Como sugirió A Haworth, también intercepté onkeydown (además de onkeyup) y evité el valor predeterminado. Esto pareció funcionar bien.
document.querySelector('#chat-message-input').onkeydown = function(e) { // User hits enter key and is not holding shift if (e.keyCode === 13 && event.shiftKey != 1) { e.preventDefault() } };Esto hizo que el campo de entrada fuera realmente sólido, lo cual es necesario para mi aplicación de chat en tiempo real. ¡Gracias!